Contact form won't go the full width

This topic has 87 replies, 5 voices, and was last updated 8 years, 3 months ago ago by Eva Kemp

  • Avatar: Michaela
    Michaela
    Participant
    May 23, 2016 at 15:19

    Hello,

    As shown in the link below – under ‘Request a quote’:

    http://demosite.myfairtradie.com.au/contact/

    My contact form won’t go the full width of the area set – I have created one using contact form and pasted in shortcode? but it doesn’t work?

    Also can you please help with the footer. I need to delete the line and change the social media icons to: facebook, linkedin, pinterest and mail icon only. How do you do this, I am struggling?

    Hope you can help asap. Details are provided in private content.

    Thank you Michaela.

    Please, contact administrator
    for this information.
    86 Answers
    Avatar: Eva
    Eva Kemp
    Support staff
    May 23, 2016 at 17:15

    Hello,

    Please add this code in Theme Options > Custom CSS > Global Custom CSS:

    div.wpcf7 input[type="text"], div.wpcf7 textarea {
      width: 100%;
    }

    To remove line in footer use this css code:

    .copyright-3 .container .row-copyrights, .copyright .container .row-copyrights {
       border-top: none;
    }

    To change social icons you need edit the file wp-content/themes/royal/framework/shortcodes.php (find the section “! Share This Product” in line 1918), comment the code you don’t need.

    Regards,
    Eva Kemp.

    Avatar: Michaela
    Michaela
    Participant
    May 24, 2016 at 09:48

    Hi Eva,

    Unfortunately the contact form has a glitch. See link:

    https://www.dropbox.com/s/99tgah4vkdq8y6m/Screen%20Shot%202016-05-24%20at%206.10.39%20pm.png?dl=0

    Also how do I create an entire new footer to replace the default one – I want it to be smaller in height, social media change, Privacy policy as a link. Can you please advise me how?

    I also need to build an entire different header. I need to move the menu to a right align and add a mobile phone icon and increase space between menu and mobile information. Please help.

    Michaela.

    Thank you.

    Avatar: Eva
    Eva Kemp
    Support staff
    May 24, 2016 at 11:19

    Hello,

    I’ve edited the code to this:

    div.wpcf7 input[type="text"], div.wpcf7 textarea, div.wpcf7 input[type="email"] {
      width: 100%;
    }

    Please check now.

    Read how to create footer using Static Blocks in wp-admin panel:
    https://www.8theme.com/demo/docs/royal/#!/9_footer

    To move menu to the right add this code:

    .navbar-collapse {
       float: right;
    }

    To add more space between mobile info use this css code:

    .menu-item-22388 {
        margin-left: 30px;
    }

    To add icons to menu you need use some plugin, for example http://wptavern.com/how-to-easily-add-icons-to-menus-in-wordpress .

    Regards,
    Eva Kemp.

    Avatar: Michaela
    Michaela
    Participant
    June 3, 2016 at 10:13

    Hello,

    Thank you for your help. I’m getting there with my site. Can you please help me increase the top menu font size by 1 point my client wants it larger.

    Link below:

    https://www.dropbox.com/s/9rmgrzr6u8ghatj/Screen%20Shot%202016-06-03%20at%206.30.19%20pm.png?dl=0

    Thank you

    Avatar: Eva
    Eva Kemp
    Support staff
    June 3, 2016 at 10:41

    Hello,

    Add this code in Global Custom CSS:

    .menu > li > a {
       font-size: 14px;
    }

    Regards,
    Eva Kemp.

    Avatar: Michaela
    Michaela
    Participant
    June 4, 2016 at 09:57

    Hello,

    I need to remove all of the footer information above the copyright and RHS links in the footer. I would then like to add my own static block containing a copyright sentence with a privacy ploicy link and my own social media icons generated through a plugin … can you advise me on how to do this?

    https://www.dropbox.com/s/1nwxc2ncj0puzjh/Screen%20Shot%202016-06-04%20at%206.20.37%20pm.png?dl=0

    Also how do I remove the ‘chat with us’ shown in the bottom RHS corner?

    Thank you.

    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    June 4, 2016 at 10:14

    Hello,

    If you don’t want to use chat on your site, then disable Screets Live Chat plugin.

    Please read how to create your own footer:
    https://www.8theme.com/demo/docs/royal/#!/9_footer

    To add copyright info go to Appearance > Widgets > Footer Copyright > add Text widget and write your content.

    Best regards,
    Jack Richardson.

    Avatar: Michaela
    Michaela
    Participant
    June 6, 2016 at 10:37

    Hello,

    As shown on the links below the second menu when I scroll down on the home page isn’t vertically centred … can this be fixed:

    https://www.dropbox.com/s/smzgxmu5tof0cyc/Screen%20Shot%202016-06-06%20at%206.59.20%20pm.png?dl=0

    https://www.dropbox.com/s/6stdwgwmdr2ac3t/Screen%20Shot%202016-06-06%20at%206.59.30%20pm.png?dl=0

    Also … can the vertical height of the footer be reduced so that the copyright and social media icons are centred within the vertical height. Maybe ‘Footer 1’ needs to be deleted completely from widgets … I’m unsure, shown in link below:

    https://www.dropbox.com/s/c6obdm2dntjcjxw/Screen%20Shot%202016-06-06%20at%207.03.03%20pm.png?dl=0

    Thank you for your support.

    Avatar: Eva
    Eva Kemp
    Support staff
    June 6, 2016 at 12:49

    Hello,

    Please use this code in Theme Options > Custom CSS > Custom CSS for desktop:

    .fixed-header-area .collapse {
      margin-top: 13px;
    }
    .main-footer {
       display: none;
    }

    Regards,
    Eva Kemp.

    Avatar: Michaela
    Michaela
    Participant
    June 14, 2016 at 10:19

    Hello,

    I have a font issue with my fonts they have all defaulted back to a random serif font and all of the text needs be set as ‘helvetica’. The typography section in ‘Theme options’ isn’t working. Is there any global code available which sets the entire site to ‘helvetica’?

    Snap shots below:
    https://www.dropbox.com/home?preview=Screen+Shot+2016-06-14+at+6.38.56+pm.png

    https://www.dropbox.com/home?preview=Screen+Shot+2016-06-14+at+6.39.13+pm.png

    I hope you can view these links. If not the website url has been included.

    Thank you.

    Avatar: Robert Hall
    Robert Hall
    Support staff
    June 14, 2016 at 10:51

    Hello,

    I’ve added this code in Global Custom CSS. Please check it.

    body {
        font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    }

    Regards,
    Robert Hall

    Avatar: Michaela
    Michaela
    Participant
    June 14, 2016 at 11:46

    Hi Robert,

    No this didn’t work unfortunately, any other leads?

    Thank you.

    Avatar: Robert Hall
    Robert Hall
    Support staff
    June 14, 2016 at 12:19

    Hello,

    It’s working for the text.
    Please clarify us with more details where exactly you want to aplly the Helvetica font and show us screenshot.

    Regards,
    Robert Hall

    Avatar: Michaela
    Michaela
    Participant
    June 15, 2016 at 09:23

    Hello,

    Unfortunately all of the text on my site has changed to a serif fault font from the theme. I need all of my headlines, sub text and body copy set as Helvetica. The code isn’t working for me anymore. Can you please help ASAP?

    Example of text x 2 examples:
    https://www.dropbox.com/s/v1unmkbci83rtme/Screen%20Shot%202016-06-15%20at%205.49.42%20pm.png?dl=0

    https://www.dropbox.com/s/vf1q6fincs7ykj2/Screen%20Shot%202016-06-15%20at%205.49.56%20pm.png?dl=0

    Also can you please help me make the Phone field wider like the others – there are two forms, see below:

    Phone contact form field needs to wider like the others:

    Request a quote form:
    https://www.dropbox.com/s/z9cp364qsnf91px/Screen%20Shot%202016-06-15%20at%205.42.23%20pm.png?dl=0

    Trade registration:
    https://www.dropbox.com/s/t6vnt7j9uyfs1uf/Screen%20Shot%202016-06-15%20at%205.42.39%20pm.png?dl=0

    My site details have been provided too.
    Hope you can help ASAP.
    Thank you for your help.

    Please, contact administrator
    for this information.
    Avatar: Michaela
    Michaela
    Participant
    June 15, 2016 at 13:17

    Hello,

    I am really hoping you can assist with the above post. I hope it’s an easy fix.

    Thank you so much.

    Avatar: Robert Hall
    Robert Hall
    Support staff
    June 15, 2016 at 14:14

    Hello,

    What browser are you using? Please clear browser cache and check the issue.
    See screenshot from my side:
    https://gyazo.com/5cc7b224515d9571611053161347c637
    https://gyazo.com/eaa1d16a44ff3816db3e979e3d1cd78f

    Also I’ve added this code in Global Custom CSS. Please check the phone field now.

    .wpcf7-tel{
    width:100%;
    }

    Regards,
    Robert Hall

    Avatar: Michaela
    Michaela
    Participant
    June 16, 2016 at 01:58

    Hello,

    Unfortunately all of the text on my site has changed back to a serif fault font from the Royal theme. I need all of my headlines, sub text and body copy set as Helvetica. The code isn’t working for me anymore. Can you please help ASAP?

    Example of text x 2 examples:
    https://www.dropbox.com/s/v1unmkbci83rtme/Screen%20Shot%202016-06-15%20at%205.49.42%20pm.png?dl=0

    https://www.dropbox.com/s/vf1q6fincs7ykj2/Screen%20Shot%202016-06-15%20at%205.49.56%20pm.png?dl=0

    Please help.
    Thank you.

    Please, contact administrator
    for this information.
    Avatar: Robert Hall
    Robert Hall
    Support staff
    June 16, 2016 at 08:50

    Hello,

    I’ve changed code in Global Custom CSS. Please check the font now.

    Regards,
    Robert Hall

    Avatar: Michaela
    Michaela
    Participant
    June 16, 2016 at 09:14

    Hi Robert,

    Thank you I was going to start resetting as font arial. Unfortunately I have cleared my cache for Firefox and the same issue is occurring??? any other suggestions?

    Browser Chrome is fine – so a tick

    Browser Safari has blue text as shown in link below:
    https://www.dropbox.com/s/gjoqcyejwf2yhkp/Screen%20Shot%202016-06-16%20at%205.36.26%20pm.png?dl=0

    Hope you can help.
    Thank you.

    Please, contact administrator
    for this information.
    Avatar: Michaela
    Michaela
    Participant
    June 16, 2016 at 12:31

    Hi,

    I need to make Helvetica work and need the site compatible with all browsers. Can you please check by opening this site in Firefox and Safari. Information in above post. Chrome is ok.

    I am quite concerned about this font issue and hope it can be resolved.

    Thank you.

    Please, contact administrator
    for this information.
    Avatar: Robert Hall
    Robert Hall
    Support staff
    June 16, 2016 at 12:31

    Hello,

    Please try it now. Don’t forget to clear all cache.

    Regards,
    Robert Hall

    Avatar: Michaela
    Michaela
    Participant
    June 16, 2016 at 13:06

    Hi Robert,

    Thank you so much we are getting there. The font weight differences vary considerably different between browsers is there any way of fixing this. This shouldn’t occur ?

    Chrome:
    https://www.dropbox.com/s/wgi7dzb6a788z6j/Screen%20Shot%202016-06-16%20at%209.11.28%20pm.png?dl=0

    Firefox:
    https://www.dropbox.com/s/3kcdc0t90u1xmpp/Screen%20Shot%202016-06-16%20at%209.12.10%20pm.png?dl=0

    Also, there is a problem with Safari – why does the blue text occur?
    https://www.dropbox.com/s/o4ukyl2uzaq81q0/Screen%20Shot%202016-06-16%20at%209.21.53%20pm.png?dl=0

    Appreciate the help.
    Thanks again.

    Please, contact administrator
    for this information.
    Avatar: Robert Hall
    Robert Hall
    Support staff
    June 16, 2016 at 13:30

    As I see you’ve added the font-weight value 800 for each elements and titles also – http://prntscr.com/bh34of

    Please set on 600 then check difference beetwen Chrome and Firefox browsers.

    Also I’ve checked site in Safari browser and there is no issue with blue text. See screenshot: http://prntscr.com/bh360v

    Regards,
    Robert Hall

    Avatar: Michaela
    Michaela
    Participant
    June 17, 2016 at 09:06

    Thank you my fonts are working now. awesome.

    Can you please help remove the white panel below my ‘Testimonials’ I would like this white strip to be the same as the grey shown on my home page? I can’t figure it out.

    Also is it possible to add a link to the PRIVACY POLICY in my footer copyright section. I need to link it to a separate page. Is there any easy way using the text widget?

    Link below:
    https://www.dropbox.com/s/4adme11lr0b5468/Screen%20Shot%202016-06-17%20at%205.02.48%20pm.png?dl=0

    Thank you so much.

    Please, contact administrator
    for this information.
    Avatar: Eva
    Eva Kemp
    Support staff
    June 17, 2016 at 10:01

    Hello,

    To remove white space add this code in Global Custom CSS:

    .page-content {
        margin-bottom: 0px;
    }

    To add link you need edit your text widget in Appearance > Widgets and write this code:
    <a href="http://your_page_url">Privacy Policy</a>

    Regards,
    Eva Kemp.

    Avatar: Michaela
    Michaela
    Participant
    June 20, 2016 at 09:39

    Hello,

    Thank you. I am getting there with this site and thank your team at Eight Theme in assisting me through my first ever WordPress site.

    So I have some smaller queries:
    Firstly half my text (pink text below darker just above button) from my slider revolution is shrinking on my mobile. I am thinking my size and line break code is incorrect. I have provided you with my WordPress details to have a look.
    https://www.dropbox.com/s/mom89qgax09ls3h/IMG_2276.jpg?dl=0

    It should look like this:
    https://www.dropbox.com/s/2pw9w6x26lf98bq/Screen%20Shot%202016-06-20%20at%206.05.18%20pm.png?dl=0

    Also, I would like to space down or line break the word ‘team’ and ‘No’ etc. in the below paragraphs:
    https://www.dropbox.com/s/hjhpax0j6w20ba5/Screen%20Shot%202016-06-20%20at%205.45.11%20pm.png?dl=0

    but still want the text to flow when viewed on a mobile. The below happens on a mobile when I hard return the copy. Is there a way around this?
    https://www.dropbox.com/s/y92y2cacgp9o1gb/Screen%20Shot%202016-06-20%20at%205.18.07%20pm.png?dl=0

    Also, I need to change the colour of the ‘Privacy Policy’ to the same colour of the grey copyright text with a pink roll over? I also need to add a space between ‘privacy policy’ and the copyright information? see below:

    My social media icons go vertical when I shrink to mobile view, is there code which keeps these icons in a horizontal line on all devices?
    https://www.dropbox.com/s/0fm22yavhq0i21u/Screen%20Shot%202016-06-20%20at%205.14.43%20pm.png?dl=0

    Thank you so much.

    Please, contact administrator
    for this information.
    Avatar: Michaela
    Michaela
    Participant
    June 21, 2016 at 09:20

    Hello,

    I hope you can help with the below.

    So I have some smaller queries:
    Firstly half my text (pink text below darker just above button) from my slider revolution is shrinking on my mobile. I am thinking my size and line break code is incorrect. I have provided you with my WordPress details to have a look.
    https://www.dropbox.com/s/mom89qgax09ls3h/IMG_2276.jpg?dl=0

    It should look like this:
    https://www.dropbox.com/s/2pw9w6x26lf98bq/Screen%20Shot%202016-06-20%20at%206.05.18%20pm.png?dl=0

    Also, I would like to space down or line break the word ‘team’ and ‘No’ etc. in the below paragraphs:
    https://www.dropbox.com/s/hjhpax0j6w20ba5/Screen%20Shot%202016-06-20%20at%205.45.11%20pm.png?dl=0

    but still want the text to flow when viewed on a mobile. The below happens on a mobile when I hard return the copy. Is there a way around this?
    https://www.dropbox.com/s/y92y2cacgp9o1gb/Screen%20Shot%202016-06-20%20at%205.18.07%20pm.png?dl=0

    Also, I need to change the colour of the ‘Privacy Policy’ to the same colour of the grey copyright text with a pink roll over? I also need to add a space between ‘privacy policy’ and the copyright information? see below:

    My social media icons go vertical when I shrink to mobile view, is there code which keeps these icons in a horizontal line on all devices?
    https://www.dropbox.com/s/0fm22yavhq0i21u/Screen%20Shot%202016-06-20%20at%205.14.43%20pm.png?dl=0

    Thank you so much.

    Please, contact administrator
    for this information.
    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    June 21, 2016 at 10:16

    Hello,

    1. We recommend you to create each text line as a separate layer and not write all text in one layer.

    2.

    Also, I would like to space down or line break the word ‘team’ and ‘No’ etc. in the below paragraphs

    Please mark on the screenshot what exactly needs to be modified.

    3. Add this code in Global Custom CSS:

    .copyright-3 .textwidget a {
        color: #787878;
    }
    .copyright-3 .textwidget a:hover {
        color: pink;
    }

    4. Add this code in Custom CSS for mobile:

    .aps-each-icon a {
        display: inline-block;
    }
    .aps-each-icon {
        display: initial !important;
    }

    Best regards,
    Jack Richardson.

    Avatar: Michaela
    Michaela
    Participant
    June 21, 2016 at 12:54

    Thank you.

    I have marked the below. My text is shrinking on the mobile view in slider revolution and there is a huge white gap between the slider and text:

    https://www.dropbox.com/s/gd7irem1ssneivj/slider%20and%20space.jpg?dl=0

    I have also marked the turnover words in my body copy. I would like to make these turnovers through all of my text to get rid of orphans and widows etc. but it creates huge gaps in the mobile view. Is there code for this that I can use to prevent this from happening:

    https://www.dropbox.com/s/vrdzxcl06kimtss/turn%20overs.png?dl=0

    Thank you.

    Please, contact administrator
    for this information.
  • 1 2 3
    Viewing 30 results - 1 through 30 (of 87 total)

You must be logged in to reply to this topic.Log in/Sign up

8theme customization service
We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.