Fancy Headers short code

(11 posts) (3 voices)

1. 

   samnasr
   Member

   im trying to make the text in the fancy header bigger or also even the whole fancy header even a little bigger so it stands out and im not able to . im using the fancy header 1 short code. i know how to customize the color of the header . is there a customization for the short code that would make the fancy header maybe larger and the text bigger

   Posted 7 months ago #
2. 

   Ruderic
   Support

   Hi,

   You can add this code to the "Custom CSS" field in the theme options panel:

   .fancy_header span {
     font-size: 15px;
   }

   Try that and let us know the results.

   Posted 7 months ago #
3. 

   samnasr
   Member

   that worked is there anything i can do to make the header little bit bigger itself and maybe even rounder around the edges

   Posted 7 months ago #
4. 

   Elliott
   Support

   Hello samnasr,

   Try this,

   .fancy_header span {
     font-size: 15px;
     padding: 14px 22px !important;
     -webkit-border-radius: 10px !important;
   -moz-border-radius: 10px !important;
   border-radius: 10px !important;
   }

   Posted 7 months ago #
5. 

   samnasr
   Member

   that worked just fine thank you Elliot

   Posted 7 months ago #
6. 

   samnasr
   Member

   Hi Elliot this css controls every fancy header that i used on any page. what if i want to make a specific look for every page for example how can i achieve that. another question what be where can i find all the borders styles that you gave me above

   Posted 6 months ago #
7. 

   Ruderic
   Support

   Hi,

   If you want the CSS styles to be applied only to certain pages, you can paste the CSS tweaks that we provided in the HTML markup of that specific page. For example:

   <style>
   .fancy_header span {
     font-size: 15px;
     padding: 14px 22px !important;
     -webkit-border-radius: 10px !important;
   -moz-border-radius: 10px !important;
   border-radius: 10px !important;
   }
   </style>

   You can find a reference of the CSS border styles here: http://www.w3schools.com/css3/css3_borders.asp

   Posted 6 months ago #
8. 

   samnasr
   Member

   Thank you guys are awesome

   Posted 6 months ago #
9. 

   samnasr
   Member

   hi there Ruderic how are you ? i got ur CSS tweaks and i want to use them in the html mark up. lets suppose the phrase that i want to use for the fancy header is : free consultation, Get started!

   what i want to know is how do i incorporate this phrase or input it into the CSS html markup ? im not able to figure that out . also i want to make the fancy header wider ( longer width wise) and have its alignment to be centered. i guess im nnot sure where to enter the phrase is the code you gave me which

   <style>
   .fancy_header span {
   font-size: 15px;
   padding: 14px 22px !important;
   -webkit-border-radius: 10px !important;
   -moz-border-radius: 10px !important;
   border-radius: 10px !important;
   }
   </style>

   the page is http://www.ezchoicefinancial.com.contact-us

   Posted 6 months ago #
10. 

    samnasr
    Member

    should i open a new post thread for my last inquiry ?

    Posted 6 months ago #
11. 

    Ruderic
    Support

    Hello,

    In this case, you can replace your CSS tweaks with these new ones:

    <style>
    .fancy_header {
      width: 960px;
    }
    .fancy_header span {
    font-size: 15px;
    padding: 14px 0 !important;
    -webkit-border-radius: 10px !important;
    -moz-border-radius: 10px !important;
    border-radius: 10px !important;
    display: block;
    width: 960px;
    text-align: center;
    }
    </style>

    Make sure to paste this code in the HTML markup of the page content. If not, it will appear in the page, as you can currently see below your breadcrumb navigation.

    Posted 6 months ago #

RSS feed for this topic

Reply

You must log in to post.