CYBER MONDAY SALE! 30% DISCOUNT!! Coupon code:cm30 Enjoy!!!

Site title and tagline wrap around

Home Forums Masonic Free Site title and tagline wrap around

Tagged: ,

This topic contains 15 replies, has 4 voices, and was last updated by  Bishal Napit 1 year ago.

Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • #1330072

    Hi there,
    I have a few questions please…

    1. Currently the first letter of my tagline incorrectly displays in the Site Title line above. I’ve noticed it also displays like this on your demo page as well: http://demo.themegrill.com/demos/?theme=Masonic

    Can you please tell me how to fix this?

    2. Is it possible to change the colour (or remove it) of the triangular grey shadow that covers the lefthand section of the header image?

    3. Is it possible to change the colour of the bar that displays the page you’re on. Ie, the menu bar is black, and then another large section of black displays underneath it displaying, for example, About Me.

    Thanks very much.
    Gail

    #1330109

    Nima
    Moderator

    Ho choosingasper,

    Your query’s answer are provided below in the similar order:
    1. Paste the given CSS code in the additional CSS box:
    .site-title {
    float: none;
    }
    2.
    header .angled-background {
    display: none;
    }

    3.
    .blog-header {
    background:#402222;
    }
    Note: You can change the color code as per your choice.

    Regards!
    ThemeGrill Support Team

    #1330131

    Hi Nima,

    Thanks very much for getting back to me, and so quickly! I’ve never played around with code before, but I’ll give it a go.

    Thanks again.

    Cheers
    Gail

    #1330265

    Hi Nima,

    Thanks very much, that all went well (even for me, the beginner!).

    I have one more question regarding the header and the site title…

    Is there any way I can move the site title up the page so that it wraps round and sits to the left of the page?

    Here’s my site (if none of that makes sense): choosingaspermdonor.com.au

    Thanks again!
    Cheers
    Gail

    #1330311

    Nima
    Moderator

    Hi choosingaspermdonor,

    Please, once paste the CSS code given below in your additional CSS box:

    .site-header-text {
        bottom: 500px;
    }

    And let us know if it is the solution for you or not.

    Regards!
    ThemeGrill Support Team

    #1330447

    Hi Nima,

    Thanks again for your help.

    This solution moved the text up the page, but I need the text to wrap around and fill the white space on the left hand side of the header. Is it possible to add a Return space after certain words?

    Or alternatively, add another image over the top of the header?

    Am also wondering if I can make the font smaller?

    And am I making it all too messy/complicated?!

    Thank you!
    Cheers
    Gail

    #1330474

    Hello Nima,

    Please disregard my previous message – I’ve done a workaround by adding some text to the image before uploading it, but I do have another question!

    Is there any way to move the site title to the left, so it sits closer to the left edge of the header (I will be adding a logo, but when I added a test image, it still pushed the site title too far away from the left).

    Thank you very much! Again…

    Cheers
    Gail

    #1330551

    Nima
    Moderator

    Hi choosingaspermdonor,

    Please, paste the CSS code provided below in your additional CSS box:

    .wrapper {
        margin-left: 0;
    }

    Regards!
    ThemeGrill Support Team

    #1331313

    Hi Nima,

    Thanks for your email again.

    Unfortunately moving the title to the top of the page hasn’t worked, because although I can view it correctly on my desktop, the title doesn’t display on a smartphone or an iPad, and only half of it displays on a smaller screen such as a laptop.

    .site-header-text {
    bottom: 500px;
    }

    Also, the code for the margin places the text right into the black page border (and even when I changed the number value it didn’t seem to move further right).

    .wrapper {
    margin-left: 0;
    }

    So what I’d like to do is:

    1. move the text back to the bottom of the page as per original (I’ll remove the code), but reduce the font size slightly so it doesn’t cover the photo image.

    2. move the text slightly closer to the left hand edge, but not so its inside the black border.

    Are you able to help with those?

    Thanks again! Really appreciate it.

    Cheers
    Gail

    #1331370

    Nima
    Moderator

    Hi choosingaspermdonor,

    Please, find the CSS code below for your solution.

    .site-title {
        font-size: 62px;
    }
    .site-header-text {
        margin-left: 0px;
    }

    Regards!
    ThemeGrill Support Team

    #1331561

    Hi Nima,

    While the solutions you’ve provided work on my larger desktop screen, everything moves when I view the site on other smaller devices, so I’ve decided to abandon most of the code and find another image to work with.

    However, I’m just wondering why this theme recommends a 1350 x 500 header image when it doesn’t fill the whole screen width?

    Is there a way I can get the image to cover the whole screen?

    Thank you!

    Cheers
    Gail

    #1331823

    Nima
    Moderator

    Hi choosingaspermdonor,

    We could see that the image is covering the full width at the moment.
    Could you please explain a bit more regarding your last query.

    Regards!
    ThemeGrill Support Team

    #1333275

    Hi Nima,

    Thanks for your response.

    Regarding the header image, it doesn’t fill the page horizontally when I’m viewing it on my iMac (it does on smaller screens/devices). There is several centimeters of black on either side of the header image.

    Thanks!

    Cheers
    Gail

    #1333490

    Nilan
    Moderator

    Hi choosingasper,

    Please try the following CSS code for the header image solution.

    .header-image figure img {
        width: 100%;
    }

    Regards,
    ThemeGrill Support

    #1335820

    Hi,

    Thanks very much for that!

    Another question: I purchased a photo for my header image and I’m supposed to add an attribution link, “within your product, website or collateral”.

    Can you tell me where I need to place this? Is it one of the fields in the Attachment Details when you select the image from the Media Library?

    Thank you!!

    Cheers
    Gail

Viewing 15 posts - 1 through 15 (of 16 total)

You must be logged in to reply to this topic.