One page site link to column

[cvdw]

Hi,

I’m working om this One Page site: https://lapauline.nl/wp/.

I have the ID’s to link to set to the column instead to the section because on mobile I like to link to the column with text instead of the column with the image. That’s working fine but… If you click (on desktop) for example on MORE, it goed to more but the active menu item switches back to the menu item above (visie) as active.
Is there a way to solve this?

And second, on ipad the active menu item keeps underlined by the primary particle but on Windows in both Firefox and Chome, the underline is only on hover but not on active menu item.

In the inline navigation the active links are set as in sceenshot.

How can the stay underlined on Windows also…?

THX, Carel

[marc_a]

Hey @cvdw,

Thanks for reaching out!

I suspect that your first issue was already been fixed by the latest updates, please try upgrading your theme to the latest version.

On the other hand, the navigation inline primary particle is working well on my development. That being we need to check your setup properly? Please give us the following information in a Secure Note.

• WordPress Login URL
• Admin level username and password

You can find the Secure Note button at the bottom of your posts.

Thank you.

[cvdw]

Hi Marc,

Everything is in the latest version.

I send you the login!

[ruenel]

Hello @cvdw,

For One Page Navigation, the ID should be added in the Section element so that the menu items will coincide. Yes, I can understand that you do not want to link to the image on smaller screens. You want to link the menu items and display the texts. This can be resolved by utilizing the “Reverse” direction in the Flexbox option so that on smaller text, all the columns with text will always display first and then the column with the image. Still, on desktops, it will display as is right now. Check out my demo in the secure note below.

You will have to create your Column structure like this:

Section 1 - set the ID here
	Row
		Column 1 with the text contents
		Column 2 with the background image

Section 2 - set the ID here
	Row
		Column 1 with the text contents
		Column 2 with the background image

Section 3 - set the ID here
	Row
		Column 1 with the text contents
		Column 2 with the background image

Section 4 - set the ID here
	Row
		Column 1 with the text contents
		Column 2 with the background image

And then in your Row Template layout, you will apply “Reverse” direction:

so that on desktop screens, you will see text/content - content/text column set up:

Section 1 - set the ID here
	Row
		Column 1 with the text contents
		Column 2 with the background image

Section 2 - set the ID here
	Row with Reverse direction
		Column 1 with the text contents
		Column 2 with the background image

Section 3 - set the ID here
	Row
		Column 1 with the text contents
		Column 2 with the background image

Section 4 - set the ID here
	Row with Reverse direction
		Column 1 with the text contents
		Column 2 with the background image

Hope this makes sense.

[cvdw]

Hi,

Yes, I know about the reverse option but than the images are after the text on mobile when not using the menu but juist scolling and that is not want I wanted so thats why I was trieing to link to the text column insteat of the section…

And what about this:

@cvdw

And second, on ipad the active menu item keeps underlined by the primary particle but on Windows in both Firefox and Chome, the underline is only on hover but not on active menu item.

In the inline navigation the active links are set as in sceenshot.

How can the stay underlined on Windows also…?

THX, Carel

[ruenel]

Hello Carel,

I understand what you have in mind. Regretfully the One Page Navigation interacts with the Sections which is why it is highly recommended to place the IDs in the section. If you can compare your page and the test page, you will see that the One Page Navigation is working as expected.

• See the links in the secure note to compare.

I would highly recommend that you add an ID team to your Section element and then team-m to the Column element. You will have to create another set of menus that is exclusively for the mobile screens and the menu item will have the #team-m which will link to the column. This means that the “Fontijn One Page” menu will be used in the One Page Navigation menu and displayed on the desktop screens. On smaller screens, since you are using the Off-Canvas, you will have to assign another set of menus that have the items linked to the columns.

Best Regards.