Still no Page title?

Continuing the discussion from True full width pages with page title at the top:

My pages are all built with no page titles appearing. How can I keep no container pages fullwidth and have page titles / post titles? What am I missing?

.page-template-template-layout-full-width .site .x-container.max.width.offset {
width: 100%;
max-width: 100%;
margin-top: 0;
margin-bottom: 0;
}

Kind regards,

Susan

Hi Susan,

Thank you for writing in, I’ve tested that custom CSS on my end and it work. Can you confirm that you’re using a Layout - Fullwidth template for your page?



Please provide us the site URL so we can take a look.

Cheers!

Yes, I am using a full width default site width, and page is No container w/header and footer.

(Resolving host/Cloudflare issue) but url is https://sbcpiano.com.

I’ll send my login info to you.

Title appears on Post page now but still not on Pages. Also no breadcrumbs.

Hello @nadiaonline,

Thanks for updating in!

Please be informed that Blank - Container and Blank - No Container page templates will not display any page titles. The page title will only display in Layout - {template} page templates.

One thing to note also is that the page title is part of the landmark header which can be found in the header by default. If you have created a custom header since you are using Pro theme, then the landmark header will no longer appear.

If you want to display the landmark header in your custom header, you might need to check out this thread: https://theme.co/apex/forum/t/category-and-archive-header-landmark/16068/2

Regards.

Thanks so much for your quick response. If I had a bottom margin to my customer Header Bar of 3% or so, would that alleviate this issue For headers and breadcrumbs?

Not sure I’m confident in my programming skills.

Susan

Two other issues:

  1. To give my website and each page a white background (with no page frame,border), would the Apex comment work for my site?

  1. I’m having trouble getting consistent header fonts. I’ve tried everything, from starting JUST with Theme Options, to adding CSS to working on each page individually. And it’s still a mess. Sometimes I need to switch From Headline to ClassicHeadline (or back). I’ve looked in so many places. Could you tell me what simple CSS code would work? I use Allegreya font for headlines and Raleway font for the body.

h1, .h1 { font-family: ‘alegreya’, sans-serif;
font-size: 40px;
font-style: normal;
font-weight: 600;
letter-spacing: .001;
line-height: 34px;
text-transform: none;
color: #1a202a;
!important;
}

h2, .h2 { font-family: ‘alegreya’, sans-serif;
font-size: 35px;
font-style: normal;
font-weight: 600;
letter-spacing: normal;
line-height: 35px;
text-transform: none;
color: #1a202a;
margin-bottom: .5em;
!important;
}

h3, .h3 { font-family: ‘alegreya’, sans-serif;
font-size: 25px;
font-style: normal;
font-weight: 400;
letter-spacing: normal;
line-height: 26px;
text-transform: none;
color: #1a202a;
!important; }

h4, .h4 { font-family: ‘alegreya’, sans-serif;
font-size: 20px;
font-weight: 400;
letter-spacing: normal;
line-height: 24px;
text-transform: none;
color: #1a202a;}
!important;
}
h5, .h5 { font-family: ‘alegreya’, sans-serif;
ont-size: 18px
font-weight: 400;
letter-spacing: normal;
line-height: 23px;
text-transform: none;
color: #1a202a;
!important;
}

Hello Susan,

​To assist you better with this issue, would you mind providing us the url of your site with login credentials so we can take a closer look? This is to ensure that we can provide you with a tailored answer to your situation.

To do this, you can create a secure note with the following info:
– Link to your site
– WordPress Admin username / password

To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Thank you.

1 Like

Hi Susan,

Upon checking, I can see that there are syntax errors in your csss code preventing it from working.

Kindly change your entire css code with this.


.page-template-template-layout-full-width .site .x-container.max.width.offset {
    width: 100%;
    max-width: 100%;
    margin-top: 3%;
    margin-bottom: 0;
}


h1, .h1 { 
font-family: 'alegreya', sans-serif;
font-size: 40px;
font-style: normal;
font-weight: 600;
letter-spacing: .001;
line-height: 34px;
text-transform: none;
color: #1a202a; 
}

h2, .h2 { 
font-family: 'alegreya', sans-serif;
font-size: 35px;
font-style: normal;
font-weight: 600;
letter-spacing: normal;
line-height: 35px;
text-transform: none;
color: #1a202a;
margin-bottom: .5em;
 }

h3, .h3 { 
font-family: 'alegreya', sans-serif;
font-size: 25px;
font-style: normal;
font-weight: 400;
letter-spacing: normal;
line-height: 26px;
text-transform: none;
color: #1a202a;
}

h4, .h4 {
 font-family: 'alegreya', sans-serif;
font-size: 20px; 
font-weight: 400;
letter-spacing: normal;
line-height: 24px;
text-transform: none;
color: #1a202a;}
}
h5, .h5 { 
font-family: 'alegreya', sans-serif;
font-size: 18px
font-weight: 400;
letter-spacing: normal;
line-height: 23px;
text-transform: none;
color: #1a202a; 
}

/* HIDE FEATURED IMAGE DEFAULT */
.single-post .entry-featured {
  display: none; !important;
}

Thanks

1 Like

Thank you!! Huge difference.

So for the Blog Page, can I adjust the top margin on that page and/or give it a title? Is my custom header hiding breadcrumbs, do you think?

Very grateful for all you’ve done! :grin:

Hi,

  1. Yes, please note that when using PRO Header, the title and breadcrumbs will be removed.

To add a blog title, you can add this in your child theme’s functions.php file


    // Add custom blog title 
// =============================================================================
function add_blog_title(){ ?>
 
  <?php if ( is_home() ) : ?>

    <header class="x-header-landmark x-container max width">
      <h1 class="h-landmark"><span>My Blog</span></h1>
    </header>

  <?php endif; ?>

<?php }
add_action('x_after_view_global__slider-below', 'add_blog_title');
// =============================================================================

Change the text My Blog with the title that you want

  1. To add space on top of your blog page, you can add this in Theme Options > CSS
.blog .x-container.offset {
     padding-top:100px;
}

Hope this helps

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.