Home Forums Air WordPress Theme Adjusting title for Project page

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #27706
    applemint
    Participant
    Purchased
    Supported

    Hi,

    My project (post) pages are made with the “Gallery on Right” Layout Template.

    I like how it looks, but it comes with a few limitations. I need a new project page that allows me to match sections of the text on the left with the images on the right. So I am trying to create a project page with a Gallery Format, but made with “Page Builder” instead, which allows for images to match up with certain text blocks.

    Though this causes two new issues.
    1. It adds an extra title, above my chosen title. How to remove this?
    2. The title I create in the Page Builder does not look like the one that comes with the “Gallery on Right page”. How to match the title (both for desktop/tablet/mobile views)?

    Please see next message with links and screenshots.

    Thank you!
    Regards!

    #27707
    applemint
    Participant
    Purchased
    Supported
    This reply has been marked as private.
    #27714
    SeaTheme
    Keymaster
    Purchased
    Expired

    Hi,

    Please paste the custom CSS code to “Appearance > Customize: Additional CSS”:
    (You need to replace the id-xxxx, xxxx is post id number, 2914 is sentient-salon-2’s post id, you can find the post id by the guide)

    body.single.postid-2914 .title-wrap,
    body.single.postid-xxxx .title-wrap,
    body.single.postid-xxxx .title-wrap {
        display: none; 
    }
    .single-format-gallery .text_block h3 {
       font-size: 34px;
           background-attachment: fixed;
        color: transparent;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        -webkit-background-clip: text;
        background-position: 50% 50%;
        background-image: url(https://www.hannasatterlee.com/wp-content/uploads/2022/06/sentient-salon1.jpg);
    }
    @media (max-width: 767px) { 
        responsive-ux.single-format-gallery .pagebuilder-wrap > .container-fluid {
        padding-left: 0; padding-right: 0;
       }
      .single-format-gallery .text_block h3 {
       font-size: 34px; margin-top: 35px;
      }
    }
    @media (min-width: 768px)
       body.single.single-format-gallery .fullwrap-layout-inn .pagebuilder-wrap > .container-fluid {  width: 700px; }
    }
    @media (min-width: 992px) {
    body.single.single-format-gallery .fullwrap-layout-inn .pagebuilder-wrap > .container-fluid {
        width: 930px; }
    }
    @media (min-width: 1200px) {
      body.single.single-format-gallery .fullwrap-layout-inn .pagebuilder-wrap > .container-fluid {
        width: 1130px; padding-left: 0px;
        padding-right: 0px;
     }
    }
    @media (min-width: 768px) and (max-width:992px) {
    #navi-header>div>ul>li {
        margin-left: 15px; 
     }
     #navi-header a {
        font-size: 16px;
     }
      .logo-image { 
        height: 40px;
      }
    }

    Regards!
    SeaTheme – FAQsWordPress CustomizationFacebook

    #27732
    applemint
    Participant
    Purchased
    Supported

    Thank you very much. I would not have found this on my own.

    1. The code: -webkit-text-fill-color: transparent; shows up partially in red in customizer. Does this mean there is an error in it?

    2. The 50% 50% for background-position of the feature image for Title Text Masking doesn’t work out the same as it does in the “Gallery on Right” Format. I’ve adjusted to 80% 10%, but it’s a bit of a fiddle to get the text readable at all media sizes.

    3. The last code for #navi-header and logo-image, is that code targeting all webpages of the specified width sizes?

    4. Viewing the title on my mobile (both in Chrome and Firefox browser apps), shows smaller than a page constructed in the “Gallery on Right” Format. However, in the Customizer mobile view, it shows the title in correct size. (I will send screenshots to clarify)

    #27733
    applemint
    Participant
    Purchased
    Supported
    This reply has been marked as private.
    #27741
    SeaTheme
    Keymaster
    Purchased
    Expired
    This reply has been marked as private.
    #27761
    applemint
    Participant
    Purchased
    Supported

    2. Thank you for the tip. It gave me the idea to crop out the too light parts of a copy of the feature image and use it solely for the title masking, so that the title will be readable in every position.

    3. Thank you. I made the logo height a little larger than your suggestion, as I find 40px too small. Is this causing the following issue?
    For 976px-1070px, and 751px-831px ( I might be a few pixels off) the logo jumps down, and sits on top of the title.

    Thank you,
    Regards

    #27764
    SeaTheme
    Keymaster
    Purchased
    Expired

    3, yes, it is.


    Regards!
    SeaTheme – FAQsWordPress CustomizationFacebook

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.

Join Newsletter(FREE)

Subscribe to our newsletter to receive news & updates. We promise to not spam you, super promise!