Single Project Widget

[MikeyC]

I’m trying to link directly to individual Single Projects from the menu bar. I have an active menu link to the projects on the single page via #projects but I can’t work out how to link to each individual project from Sub menus so the link selected then scrolls to the correct project. There is a URL box for each project but I have no idea what to put in that URL description to make the link work. Any help gratefully received
Mike

[Hans (Support Admin)]

Hi @MikeyC

You could include an anchor in the content/text section for the previous project.

To create an anchor read this http://www.echoecho.com/htmllinks08.htm

Then in the menu you would use

/#project-name

project-name would be whatever you used in the anchor name.

• This reply was modified 4 years ago by Hans (Support Admin).
• This reply was modified 4 years ago by Hans (Support Admin).

[MikeyC]

Thanks for that – managed to get that working but the result is the link to the first project scrolls to the correct place, the second overshoots and scrolls past the title as does the third – is there a way of adjusting the scroll destination so it lands at the correct part of the display?
Thanks for your help
Mike

[Hans (Support Admin)]

Hello @MikeyC

You will need to add a some top padding to the anchor in that case to compensate for the sticky header (menu).

I believe it is about 66px.

[MikeyC]

Hi Hans, thanks for that, have tried to do that but so far failed miserably. Any chance of a bit more detail in how and where to add padding to the anchor? My HTML/CSS knowledge is extremely limited.
Thanks once again for your patience
Mike

[Hans (Support Admin)]

Hi MikeyC,

Try the code in this screenshot,

https://www.dropbox.com/s/zxvxhxysvwrh10f/anchor-css.PNG?dl=0

It’s not an ideal solution but it will do the trick.

• This reply was modified 4 years ago by Hans (Support Admin).

[MikeyC]

Hans thank you for that – I tried adding this

style=”padding-top:66px;”|>

but all I can achieve are the words

style=”padding-top:66px;”|>

appearing in green under the project description text!

• This reply was modified 4 years ago by MikeyC.

[MikeyC]

Ah, I think I see why you used a .png to display code!I did add the full code as you suggested even though the post above has truncated it but the end result is as you see above
Thanks
Mike

[Hans (Support Admin)]

Remove the vertical bar after the 66px. That was my cursor in the screenshot.

[MikeyC]

Hi Hans
So I have removed the cursor(!) but its still not having any effect on the scroll end position. What I have noticed is that the ; after 66px is always removed when I hit Save in the Single Projects Widget.
Let me just repeat in case I’m doing something very silly – the code you have suggested has been placed in the Projects Description of the relevant single project – this is also where I had my original anchor.
Thanks
Mike

[Hans (Support Admin)]

Can you provide me with admin access so I can log in and have a look?

[MikeyC]

I’m using MAMP as a local server so its not online at present. I guess that rules that out?

[Hans (Support Admin)]

Hi MikeyC

Yes it does.

There are 2 other things you can do.

Try using a margin instead.

margin-top:66px

Or add a class name and add the CSS in the Custom CSS field of the Custom Code section of Parallel Options.

See here https://www.dropbox.com/s/0y09etyugcti7j9/project-padding.txt?dl=0

[MikeyC]

This reply has been marked as private.

[Hans (Support Admin)]

Hi @MikeyC

The issue is most likely with your hosting environment (meeting the requirements for WordPress) or your installation of WordPress.

Our theme will work without any issues if those conditions are met.

So just to be clear, the issue isn’t related to our theme, as that is simply a skin which is added to the body (WordPress).

This will probably help you https://wordpress.org/about/requirements/

Once you get it running and have any questions about the theme itself, I’ll be here to answer your questions.

Also, looking at the error log will help you as well.

• This reply was modified 4 years ago by Hans (Support Admin).