- This topic has 38 replies, 4 voices, and was last updated 2 years, 5 months ago by
Fernando.
-
AuthorPosts
-
September 6, 2022 at 10:10 am #2335149
Jessica
Hi there! I’m trying to create a page that looks like this: https://cairnproject.flywheelstaging.com/cairn-project-news for all of my blog category archive pages. I think it would be best to create a Content Template Block element to apply to category archive pages, but then I’m stumped because I need the category types listed right below the header to make it clear what page people are on. Is it possible to do that somehow within this element? (eg change the style – bold/background color – of the current category)
Or maybe there’s an easier way where I can build these pages individually and then make URL/category/category-name go to these pages? Would I just set up a redirect or change the URL of these stand alone pages to URL/category/category-name within the page editor?
Thanks in advance for any help you can provide!
September 6, 2022 at 1:47 pm #2335275David
StaffCustomer SupportHi there,
would something like this work ?
https://gpsites.co/dispatch/category/time-saving/
In the Dispatch site i hooked in the Secondary Navigation which is displaying the Category archive menus.
If so:
1. Create a new Hook element.
2. Add this code to the hooks text area:<div class="second-nav grid-container"> <?php if ( function_exists( 'generate_secondary_navigation_position' ) ) { generate_secondary_navigation_position(); } ?> </div>
3. Set the Hook to
generate_after_header
and increase the Priority to25
so it appears after the page hero.
4. Set the Display rules to your Category > Archives.Does that do it ? Or have i completely missed the point lol
September 6, 2022 at 6:01 pm #2335390Jessica
Oooh that’s a good idea I hadn’t considered! I’m already using the secondary navigation as the donate/donate monthly blue bar at the top. I guess I could use a hook for that secondary nav content instead and then use the secondary navigation for this category navigation.
How did you style it with the background colors?
September 7, 2022 at 1:05 am #2335636David
StaffCustomer SupportThe background colors are all see in Customizer > Colors –> Secondary Navigation. It has Initial, Hover and Current color options
September 8, 2022 at 8:03 pm #2337540Jessica
Ahh gotcha, I may try that then! Just curious, my other question about faking the category names/URLs, would that be possible, eg have each of these regular pages URLs be URL/category/category-name? Or is the best/most logical way to do this by creating a category page template like we’ve discussed? Thanks again!
September 9, 2022 at 5:58 am #2337930David
StaffCustomer SupportYou can use redirects or the method here for using static pages.
I personally would only do tahtif i really want to individually customize each category page with long content.
Otherwise i just use the automatic archive pages, and the Block Element to hook over content around my post loop.
September 12, 2022 at 8:28 am #2340752Jessica
Ahh gotcha! Okay one more question on that… with the automatic archive pages and GeneratePress, is there a way to change the style of the blog posts, or is it just the settings within the Customizer? eg Would I be able to make the automatic posts page look like the blog page https://cairnproject.flywheelstaging.com/blog or am I limited to the WordPress Customizer settings and can’t change how the actual posts show up? Thanks again!
September 12, 2022 at 8:37 am #2340767David
StaffCustomer SupportFor sure, you can crate a Block element – Content Template:
https://docs.generatepress.com/article/block-element-content-template/
You just build the single content template as you have in your query loop and set your display rules to Blog, Category Archives and it will do that
September 12, 2022 at 9:27 am #2340819Jessica
Oh yes duh I forgot about that – thanks so much David! I think this is resolved for now and I’ll start a new thread if I have any issues from here. Thanks again for your help!
September 13, 2022 at 3:03 am #2341408David
StaffCustomer SupportYou’re welcome !
September 13, 2022 at 1:17 pm #2342069Jessica
Okay I’m stumped again unfortunately! Here’s the category page I’m working on: https://cairnproject.flywheelstaging.com/category/our-community And here are my issues:
1) How do I get the secondary categories menu to JUST show up on the blog/category archive pages, not on the full site? I created the hook you shared and am not having any luck having it show up on just the category pages.
2) How can I get the header image (the blue sky image) to be full width regardless of screen size? I tried changing container size in the customizer but I have to set it at a number – is there a way to make this automatically full width? Is there any way to have this hero background image set independently for each category archive page?
3) Is there a way to center align the pagination at the bottom?
September 13, 2022 at 5:22 pm #2342179Fernando Customer Support
Hi Jessica,
1. Can you check if you hook display rule is set to
Post Category Archive
?2. How are you adding the Page Hero? If it’s a Block Element, set the hook to
after_header
. If you want different Background images for each category, you’ll either need to create a new Block Element – Page Hero for each, or create a custom image field in your images and use that image instead – (For this issue, please start a new topic).3. Try adding this CSS for Category Archives:
.category.archive .nav-links { text-align: center; }
September 13, 2022 at 6:55 pm #2342215Jessica
Hey Fernando, thanks for your help!
1) Yes it’s set to that.
2) One background image for all works, and I have this set up as a Block Element – Page Hero – set to Before content container hook name before_main_content. I have the hook set to generate_after_header priority 25, but I still only see the menu showing up at the top of the website.
3) That worked perfect for the pagination, thank you!
A couple other issues on this page, do I need to start a new topic? I still can’t get 40px of padding around the edge of the posts but keep the page hero header full width – any ideas? And I’m using CSS for even containers to get the post sizes lined up on regular pages, but that CSS isn’t working when applied to the post/card template. Thanks again!
September 13, 2022 at 7:02 pm #2342219Fernando Customer Support
Let’s tackle #1 and #2.
1. While viewing the page the shouldn’t have the hook element, can you hover on Elements in the Admin bar at the top and see if the same Hook Element is the one displaying? Check the display rules of that hook as well.
2. Can you set the Page Hero to
generate_after_header
, then try to replace the priority of the Hook to something higher like100
?Please start a new topic for the other issues.
September 13, 2022 at 7:48 pm #2342237Jessica
The hook element for the categories menu isn’t showing up on pages where it shouldn’t be – only on category pages. I think this secondary menu is showing up everywhere because it’s marked secondary menu in locations under Customizer – Menus. I can’t figure out how to get it off that display but have it show up on the blog categories page.
2. I tried that and it made the page funkier: https://cairnproject.flywheelstaging.com/category/our-community The hook code from above is now set to 100 generate_after_header and the Page Hero element is set to after_header priority 1.
-
AuthorPosts
- You must be logged in to reply to this topic.