[Support request] Setup Below Navigation and Author Card

[iskandar]

Hello,
I’m looking for support from generatepress developer here.
Today I visited kucingpedia.com (they use generatepress too).
I interested on setup my blog like them.

1. I like to setup the below navigation on mobile only like them (even on homepage or blog post)
2. I like to add an author card on above article on blog post only.
3. I like to add table of content in navigation (when visitor visit the blog post) like them.
4. I like to add a dark mode on navigation like them.

That’s enough for me now. Thanks for your help.
Best Regards.

[David]

Hi there,

1. Enable the Mobile Header. https://docs.generatepress.com/article/mobile-header/
Enable the Off Canvas Panel for Mobile. https://docs.generatepress.com/article/off-canvas-panel-overview/
Then add this CSS:

@media(max-width: 768px) {
	#mobile-header {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
	}
	body {
		margin-bottom: 60px;
	}
}

2. Author Box Plugin has the option to display before ( and after ) content:

https://en-gb.wordpress.org/plugins/simple-author-box/

3. This Plugin:
https://wordpress.org/plugins/table-of-contents-plus/

You can add the TOC Widget to the Off Canvas Panel.

4. Unfortunately that would take Custom Development which is out of the scope of this forum.

[iskandar]

Can you assist me how to add TOC Widget to the Off Canvas Panel? So I can follow the step.

[David]

1. Customizer > Layout > Off Canvas – Enable it for Mobile.
2. Appearance > Widgets look for the TOC+ Widget and drag it into the Off Canvas Widget area.

[iskandar]

The list of TOC successfully added to the mobile navigation but the primary navigation menu is gone.
So what should I do to activate the off canvas TOC and the navigation menu. Both of them in the same navigation bar (TOC list on top and the list of menus on the bottom).

[David]

If you want the Menus below the TOC then yes, add a Navigation Widget to the Off Canvas as well.

[iskandar]

I successfully added the menus below the TOC list, but the problem is the list of menus is in horizontally layout like this:

MENU 1 MENU 2 MENU 3 MENU 4

What the perfect code to make the list of menus vertically layout.
So the menu looks like this:

MENU 1
MENU 2
MENU 3
MENU 4

[David]

Can you remove the Navigation Widget. And then edit the Menu and set its Display Location to Off Canvas Menu. Once its in place i can provide some CSS to move it below the TOC Widget

[iskandar]

Now I already remove the navigation widget then add a menus and set its display location to Off Canvas Menu. So what css should I add to generatepress?

[David]

Looks you resolved it ?

[iskandar]

Not yet.
I’m waiting for some CSS to move the navigation below the TOC off canvas widget and make it vertically layout.

[David]

Currently the Off Canvas still has the two widgets – can you remove the Nav Widget and instead add set the Appearance > Menu to the Off Canvas location

[Author]

Posts