Important notice: we will respond to all open ticket requests up until November the 1st. After this date, we will be unable to process the ticket requests here on Ticksy.

Okay
  Public Ticket #1996408
Contact Form 7
Closed

Comments

  • fabienne started the conversation
    May 2, 2019 at 2:46pm

    Hello,

    I am making a website in the Borderland theme. However, I cannot seem to find where I can adjust the dimensions of the Contact Form 7 elements. When going to Elated options->Contact Form 7-> Custom Style 1,2 and 3 settings. They do not work...what am I doing wrong ?

    I want the Contact Form 7 to look like the one on the Borderland theme. (see attachment). How do i get the image behind the form and how do i make it transparant ? I know html/css but don't know which id and/or class to use.

    How am I proceeding ?

    tx, 

  • fabienne replied
    May 2, 2019 at 2:49pm

    sorry, forgot to mention my login info:

    htpps://www.whiteglow.be/wp-admin

    wp login : fabiennedevriese

    pasw: U(!iK@l(@kX&NQkQ

  •  1,845
    Elated replied
    May 8, 2019 at 10:22am

    Hi there,

    I apologize for the belated reply - our reply times have not been as fast as we would have liked due to recent holidays. I hope you understand.

    I'm sorry, but I was unable to find the example you attached on our demo. Could you provide us a link to the page it is displayed on?

    In the meantime, you can try the following:

    In admin panel go to Contact -> Add new. Replace the content of the form with the following code:

    <div class="two_columns_50_50 clearfix">
 <div class="column1">
  <div class="column_inner">
   [text* first-name placeholder  "First name"]
  </div>
 </div>
 <div class="column2">
  <div class="column_inner">
   [text* last-name placeholder  "Last name"]
  </div>
 </div>
<p>[text* your-subject placeholder  "Message Subject"]</p>
</div>
<div>[textarea* your-message placeholder "Write..."]</div>
<div>[submit "submit"]</div>

    So ti should look like on the screenshot below:

    7156514505.png

    Here you can also see the class names for these elements, so you can edit them with some CSS futher if you want.

    Next you go to your contact page, remove the old form's shortcode, and add the Contact Form 7 element using WPBakery. Here you will select your new made contact form, and style you wish to apply which you can set according to your needs in Elated Options.

    6360507607.png

    Regarding the background image, you can set it in row settings using the WPBakery as you can see on the screenshot below:

    7021925753.png

    If you need any further assistance, please let us now.

    Best regards!

    Joey

    The Elated Support Center has been moved to our centralized support platform. 

    Please note that any existing tickets prior to this change will be answered right here on Ticksy, and in due time. 

    If you wish to submit a new support request, for all new inquiries please head on to our Help Center.

    Elated Themes is part of Qode Interactive – the home of 300+ premium WordPress themes.

    Don’t forget to sign up for our newsletter and be the first to find out all the latest news.

  • fabienne replied
    May 12, 2019 at 11:55am

    Hi Joey,

    I do need your assistance unfortunately.

    i did everything you said and i succeeded in implementing your code. However:

    - if I put the (background) image in the row like you mentionned, it just takes the dimensions of the form and not the whole page as is shown in the borderland theme (https://preview.themeforest.net/item/borderland-a-daring-multiconcept-theme/full_screen_preview/10939025). Then Elements-Contact Form7-example below (transparant form elements and image across the screen).

    - i tried several things like 'Template' -> 'Full width' and 'Full witdh section' but that did not work because it takes also the form so the form gets stretched across the screen

    - also, the elements are not transparant and remain with a white background even though I put opacity to 1 in Contact Style 1.

    please login to my backend and try to see what i mean :

    htpps://www.whiteglow.be/wp-admin

    wp login : fabiennedevriese

    pasw: U(!iK@l(@kX&NQkQ

    thanks for helping me out,

    Fabienne

  •  1,845
    Elated replied
    May 15, 2019 at 1:34pm

    Hello Fabienne,

    Thank you for writing in.

    I can see you have manage to set transparency. There is a couple of things that are different from the demo contact form and for sure they have impact on your issues. Demo contact form is using horizontal header, full screen page template, background picture has different size and here is some screenshtos with options used in demo:

    7736646966.png

    Please try to use some of this tips to customize your contact form.


    Let us know if there's anything else!

    Best regards,

    Gule

    The Elated Support Center has been moved to our centralized support platform. 

    Please note that any existing tickets prior to this change will be answered right here on Ticksy, and in due time. 

    If you wish to submit a new support request, for all new inquiries please head on to our Help Center.

    Elated Themes is part of Qode Interactive – the home of 300+ premium WordPress themes.

    Don’t forget to sign up for our newsletter and be the first to find out all the latest news.