Archived topic
Adding Entry Meta on Pages - rendering outside .entry-header DIV
9 replies · Started by Morgan on July 29, 2019
So I https://docs.generatepress.com/article/add-entry-meta-to-pages/ , works a treat, yet need to reach out as the tricky custom meta layout David helped with seems to have broken layout/padding. It's rendering outside the .header.entry-header div, so it's breaking.
Pls advise, coz I don't know coz my eyes are melting out of my skull after my 5am start right now.
Page: https://storyclusters.com/unsdg/
Post: https://storyclusters.com/radical-pandas/
Current CSS
/* _meta */
.entry-header .gp-icon {
display: inline-block;
font-size: 17px }
.cat-links:before, .tags-links:before {
display: none !important }
.cat-links, .tags-links {
font-size: 0 !important }
.cat-links a, .tags-links a, .author-name {
font-size: 16px;
margin-right: 0.75em }
.cat-links a:not(:first-of-type):before, .tags-links a:not(:first-of-type):before {
content: ',';
margin-right: 0.75em }
footer.entry-meta {display:none }
Hey Morgan,
Did you fix this? I'm not seeing any differences between the two examples.
Let me know :)
There's definite differences - note padding, and its happening coz of what I said above - it's not inside the DIV it should be.
Ah, pages don't have a hook inside the <header> element, which is why it's not inside of it.
Try adding this CSS:
.page .entry-meta {
margin-top: 0;
background: #fff;
z-index: 9999;
position: relative;
top: -10px;
}EDIT: no, that breaks layout, that's why I'm asking here - because CSS is dependent on meta being inside header.
I tried wrangling it, thought I had it, but everything was broke various resolutions across archive, search and Pages :-P .
Hoping you can now tell me what's broken here : https://reel.marketing/unsdg/ , after doing the Meta, then turning off snippet, this header remains broken esp smaller screen sizes. Cannot grok what's causing it, and .inside-article ... in this suddenly not showing in devtools:
'@media (max-width: 769px) {
.post-image-above-header .inside-article div.featured-image img { height: 330px }
.inside-article .featured-image + .entry-header {
width: 80%;
padding: 6% 4% 4% 0}'
Suddenly not working.
Is there no way to get a hook inside header for pages?
- - -
The only way to add it to the <header> element on pages is to copy the content-page.php file in the parent theme, and add it to your child theme.
That way you could add your own hook and use it, as a default hook doesn't exist there.
Using a child theme: https://docs.generatepress.com/article/using-child-theme/
Let me know if you need more help with that :)
In the interests of getting this site live asap, think I'll leave it for people that know what they're doing :-P .
No plans to add a hook in header/reasons against?
I think a page-specific hook in that area would be beneficial. I'll log it as something to look at for GP 2.4 :)
Good stuff, I'll stay posted :)
