Archived topic
Change width of Hook area
12 replies · Started by Kevin on January 21, 2022
So I'm trying to add a "Related Articles" section to the bottom of a Page that is the FULL WIDTH of the page (I'm running a side bar so the Main Content container is less than the full page width).
I want the section to be AFTER the main content and BEFORE the Comments container.
There is a "generate_after_main_content" hook, which meets the "Full width of page" criteria, but it generates it AFTER the comment box (not what I want).
There is a "generate_before_comments_container", which meets the location criteria I want, but it is not the full width of the page, it's the width of the Main Content Container and Comments Container.
So how can I accomplish both of these criteria (the location between Main Content and Comments, AND full width of the page)?
Is there a way to code in the width of the hook?
Here is a visual representation of what I'm trying to do (this site does not have comments, but you can imagine the comments are below the dark gray section with the 4 other posts): https://code.tutsplus.com/
In addition, I would like to be able to change the background of the entire hook area, similar to the example above. I know how to change the css properties of the container I'm using, but is there a way to change it for the entire div?
Thanks!
Hi there,
Any chance you can link us to the site in question?
You can use the private information field.
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information
Let me know :)
I can if there's no other path forward.
But it seems that the solution would be universal across sites using the generate press theme. Is that not the case?
It would be much easier for me to provide the best and easiest solution if I can see the issue.
Thanks!
Staging site url is in the private info field...
Unfortunately it's not possible to make that hook full width as it exist within the site content container which is contained.
You would need to set the content container width to full in order to achieve that:
https://docs.generatepress.com/article/content-container/
Isn't there a way to make custom hooks?
Some of the other hooks are the width of the full page.
Custom hooks wouldn't help in this case unfortunately as the position you want is still within the container itself.
The full width hooks are not within the container. See this visual guide for reference:
https://docs.generatepress.com/article/hooks-visual-guide/#single-post
Ok, is there a way to move the Comment container location? Perhaps to be a hook location?
So that actually works...
I moved the comments container to be before the footer, and that makes it the full width.
Then, the related articles div I've made is also full screen with either of the hooks 'before_footer' or 'before_comments'.
Thanks for your help!
So that actually works…
I moved the comments container to be before the footer, and that makes it the full width.
Then, the related articles div I’ve made is also full screen with either of the hooks ‘before_footer’ or ‘before_comments’.
Thanks for your help!
Glad to hear :)