Home>Support>Header text

Header text

Hi I want to change the size, position and color of my header text(Which is my mobile number). I upgraded to highest premium. but it seems it is not helping. I appreciate it you can help me with this. My website address is www.ovenstar.com.au you can have a look.

URL: http://www.ovenstar.com.au

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 26 days ago Andrew Misplon
    Hi, I Work Here

    Hi Nahdi

    Thanks for your support, much appreciated.

    The header text is, unfortunately, not included in the Customizer Theme Design section. Please, try adding the following to Appearance > Custom CSS:

    /* Header Text */
    
    #masthead .hgroup .support-text {
    	color: #4b4b4b;
    	font-size: 13px;
    }
    

    Adjust both values as required.

    Let me know what you’d like to do in terms of position and I’ll assist with that.

    Thanks :)

  2. 9 years, 25 days ago Nahdi Gefariann

    thanks Andrew. unfortunately nothing changed

  3. 9 years, 25 days ago Andrew Misplon
    Hi, I Work Here

    Thanks for inserting the Custom CSS. Did you change the hexadecimal color value and font size? They still look the same in your Custom CSS. To confirm, you’d need to now insert your own color and own font size. You should then see a change.

  4. 9 years, 25 days ago Nahdi Gefariann

    I got what you mean, now I have to position the words, and it would be great if I can put mobile number up and enquiries 7am-7pm underneath or vicevresa

  5. 9 years, 25 days ago Nahdi Gefariann

    Reply

    I got what you mean, now I have to position the words, and it would be great if I can put mobile number up and enquiries 7am-7pm underneath or vicevresa

  6. 9 years, 25 days ago Andrew Misplon
    Hi, I Work Here

    Hi Nahdi

    If you need more flexibility from this field then it would be be better to move over to Appearance > Widgets and insert a SiteOrigin Editor widget into the Header widget area. It’ll replace the text you have now and give you more freedom. Let us know how that goes.

  7. 9 years, 25 days ago Nahdi Gefariann

    may I ask you to explain what siteorigin editor widget is?

  8. 9 years, 25 days ago Andrew Misplon
    Hi, I Work Here

    It’s a widget version of the regular WordPress editor. If you have our Widgets Bundle plugin installed, it will be available to you:

    https://wordpress.org/plugins/so-widgets-bundle/

  9. 9 years, 25 days ago Nahdi Gefariann

    also there is no header widget area in my widget, there is only a written word(Header) and its not even clickable, may I ask to explain more please

  10. 9 years, 25 days ago Andrew Misplon
    Hi, I Work Here

    You can either drag widgets into the widget area OR you can click on any widget to the left, it’ll then give you the option to insert it into the Header, Sidebar or Footer area.

  11. 9 years, 25 days ago Nahdi Gefariann

    thanks a lot Andrew, I did but now the widget editor is unable to change the size and color of header text, infact I can
    change the size and color in editor page but after I save the changes it doesn’t affect the header text.

  12. 9 years, 25 days ago Andrew Misplon
    Hi, I Work Here

    Not looking bad now. Let me know what attributes you’d like each line to have, color, size, etc. and I’ll assist. Thanks.

  13. 9 years, 25 days ago Nahdi Gefariann

    I want them bigger size and perhaps green

  14. 9 years, 25 days ago Nahdi Gefariann

    but I have to try different colors and sizes there to make sure it looks good enough

  15. 9 years, 25 days ago Andrew Misplon
    Hi, I Work Here

    Sure; insert the following at Appearance > Custom CSS:

    /* Header Widget Area */
    
    #masthead .hgroup #header-sidebar .widget-title {
    	color: #000000;
    	font-size: 14px;
    }
    
    #masthead .hgroup #header-sidebar .textwidget h2,
    #masthead .hgroup #header-sidebar .textwidget h2 a {
    	color: #000000;
    	font-size: 14px;
    }
    

    That should hopefully do the trick.

  16. 9 years, 24 days ago Nahdi Gefariann

    thanks, its working but I want to be able to have a bigger gap between title and phone number when I increase their size, can I add a code to choose the distance I want between them?

  17. 9 years, 24 days ago Nahdi Gefariann

    also if possible I need to move them horizontally, so basically I need to position them vertically and horizontally.

  18. 9 years, 24 days ago Nahdi Gefariann

    should I start a new thread for this?

  19. 9 years, 24 days ago Andrew Misplon
    Hi, I Work Here

    Sure. Change your custom CSS for this section to the following.

    /* Header Text */
    
    #masthead .hgroup .support-text {
    	color: #04892d;
    	font-size: 20px;
    }
    
    #masthead .hgroup #header-sidebar .widget-title {
    	color: #000000;
    	font-size: 20px;
    	margin-top: 5px;
    	margin-bottom: 10px;
    }
    

    Adjust the margin-top and margin-bottom values as required.

  20. 9 years, 24 days ago Nahdi Gefariann

    thanks Andrew but I still cant move them right or left, is it possible?

  21. 9 years, 24 days ago Andrew Misplon
    Hi, I Work Here

    You can move the entire widget area around as follows:

    #masthead .hgroup #header-sidebar {
        right: -20px;
    }
    

    Negative values to move it right, positive values to move it left.

  22. 9 years, 24 days ago Nahdi Gefariann

    oh perfect, thanks andrew

  23. 9 years, 24 days ago Andrew Misplon
    Hi, I Work Here

    For sure :)

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More