Grey Box and Page Titles

  • Author
    Posts
  • #157285

    lifetogetherkorea
    Member
    Original poster

    Regarding the grey box in the photo at the top of the homepage, I have 3 questions:
    1. Is it possible to make the grey box lighter (not completely transparent)?
    2. Is it possible to make the grey box smaller?
    3. Is it possible to make the grey box lower (centered) in the photo?

    Also, following suggestions from staff on the forum, I found a way to keep the menu from moving. However, that change interferes with the way page titles are shown on other pages (about, make a difference, etc.). And it is different on different devices. Is it possible to remove the black box, title, and line from each of the content pages?

    Thank you.

    The blog I need help with is: lifetk.org

    #157310

    lifetogetherkorea
    Member
    Original poster

    Note: 1. I found a way to make the grey box lighter. 2. I also found a way to change the width of the grey box, but I still would like to know how to reduce the height of the grey box. 3. I still would like to lower the grey box in the photo so it is more centered in the image.

    Regarding the title/black box/line on other pages: I found a way to remove the black box and line, but in order to do that I had to add a header image. On a laptop, that works ok. But on a phone or tablet, the image (and sometimes the title) isn’t visible, or is only partly visible unless you pull it down and hold it. Is there a better way to simply remove the black box and title and line from each page?

    #157319

    anarieldesign
    Theme Author

    Hi,

    thank you for using our theme.

    You can change the size and position of the box by adding this to Custom CSS:

    body.home .content-caption {
        max-width: 70%;<code></code>
        padding: 10px 30px;
    }
    @media screen and (max-width: 100em){
    .page-template-main-page .cd-fixed-bg {
        padding: 230px 0 100px 0;
    }}

    As you have Custom code for the fixed menu and you don’t use featured image as a top background you’ll need to add this to the Custom CSS:

    .page-template-full-width-page .default-page.up .site-content {
        margin-top: 8%;
    }

    Hope this helps,
    Ana

    #157351

    lifetogetherkorea
    Member
    Original poster

    Thank you. That fixed the placement of the grey box on the home page. However, the header image (featured image) on the other pages still isn’t visible on the other pages on a tablet or phone. Is it possible to completely remove the title name and box that surrounds it on other pages?

    #157403

    anarieldesign
    Theme Author

    Hi,

    you can add this to Custom CSS:

    @media screen and (max-width: 59.6875em) {
    .page-template-full-width-page .cd-fixed-bg {
        min-height: 500px;
    }
    }
    
    @media screen and (max-width: 48.75em) {
    .page-template-full-width-page .cd-fixed-bg {
        min-height: 400px;
    }
    }
    
    @media screen and (max-width: 38.75em) {
    .page-template-full-width-page .cd-fixed-bg {
        min-height: 350px;
    }
    }

    Hope this helps.

    All the best,
    Ana

The topic ‘Grey Box and Page Titles’ is closed to new replies.