jjohansson

Thank you so much Tuan!

Site URL: https://pineapple-iguana-gne9.squarespace.com Hello everyone! How could I adjust the width of portfolio pages? I can´t find the PAGE HEADER CODE INJECTION for the subpages. Any idea? I want to make the content displayed less wide in desktop. In the screenshot notice the overlaping in the left side with Title... https://pineapple-iguana-gne9.squarespace.com/works/josef-jagnefalt No Password Required

Thank you @Nyi it worked super fine. DO you know how could I set the mobile version with a different height?

Hi @Ziggy How could I move up the instagram icon of this Menu? https://pineapple-iguana-gne9.squarespace.com Password: Seesome22!

Thank you Tuan, that works! I wonder how could apply the 6.5vw instead of pixels.

Hi @Spark-Plugin Any idea about how to assign a padding top for all the pages of the whole site at once?

Site URL: https://hughgordon-test.squarespace.com Hi everyone! I have customised with the support of many colleagues the Menu to be displayed in the left side on Desktop. I wonder how to set a "Universal" rule to padding all the content with the same height... (taking the reference of the Title height) https://hughgordon-test.squarespace.com Password:2025 If there is no universal fix to achieve that, could it be done manually page by page, could I set proportional padding like the Title height to start and keep all the content with that level? Thank you very much!

@tuanphan Any idea how to move up the Instagram icon? Up like the end of the image would be perfect... https://pineapple-iguana-gne9.squarespace.com

@tuanphan yes I meant moving the image down, all the items starts with that height. Do you think is possible to apply to the whole site somehow?

Thanks for your quick response! I have one last question, how could I add the Instagram icon below that menu items but giving some extra space towards bottom? I want to move up to align with the end of the image... any idea?

Password: 2025 I wonder how to add the padding with proportional size not fixed with pixels...

Site URL: https://hughgordon-test.squarespace.com Hi @tuanphan I wonder how could I add padding to move down a little bit the image section (see screenshot attached) I want to set it like the Title height. Any idea?

That works perfect @tuanphan I have one last question, see screenshot attached and please let me know how could I set the top of the image to the same height like the Title has. Thanks!

@tuanphan #1 and #2 worked perfect! How could I move down the Title and Nav items? See image below. with the position I want...

You can try now, is working with that password: 2025 https://hughgordon-test.squarespace.com Thanks!

Hi everyone, Password of my project is 2025 I’ve noticed that many users, have proposed various approaches and solutions for implementing a vertical menu in Squarespace. However, it seems there’s still no template or custom code currently available that supports this feature seamlessly. I have a few specific questions: How can I move the nav items in that area (up, down, left, and right)? What’s the best way to align the menu with the Title/Image? How can I customize the padding of the content area? Could anyone share their insights or custom solutions that have worked for you? I’d love to hear about any effective methods or code snippets that could help achieve this layout. Like some of the users asking this Thanks in advance! Here is the post/code im using at this moment and below the image of the desired menu layout.

Hi @tuanphan Im interested in the last question from @Floe and also I wish to understand how we can align Title/Logo with the Nav items on their left side. Thanks!

Site URL: https://www.hughgordon-test.squarespace.com Good morning @Ziggy I wonder if you could give me any tip to align the Title and the Nav items. I also wonder how to move the nav items up or down... The site is password: protected: 2024 www.hughgordon-test.squarespace.com Any idea will be welcomed, thanks! This is related to this customisation discussed here yesterday:

Thank you so much, it worked really well!

works perfect @Ziggy thank you so much for your super fast response!

I would like to have like in this image... (the image could be displaced to the left if necessary) and I wonder the instagram icon also how could I place there...

It worked smoothly and you was so fast! ; ) thank you so much @Ziggy I have a last question regarding moving vertically or horizontally that menu items, any idea or suggestion?

In the image you will see the white color in the left side of the screen... I just want to set it with the same grey than the image has. Basically to know how I can set a custom background color for that left area. If you need access as admin I send you an invitation.

This didn't work @tuanphan I can't fix the Background color of that left menu as you can see in the picture attached... any idea?

Site URL: https://hughgordon-test.squarespace.com Hi everyone! I need to set a background color for the specific area of the Menu wich I've customised with the code below to appear in the left side of the screen on Desktop. https://hughgordon-test.squarespace.com/ Password: 2024 I can´t find the way to simply set the color background like the other areas of the page. I get that white block and I don't know how to solve it... Could somebody help with some idea or solution? @Ziggy Thank you!! /* Float header */ @media screen and (min-width:992px) { body:not(.sqs-edit-mode) { .header-title { position: fixed; top: 3vw; left: 5vw; z-index: 9999; } .header-nav { position: fixed; top: 50%; left: 5vw; padding: 0 !important; transform: translateY(-50%); } nav { flex-direction: column; } div.header-nav-item { margin: 0 !important; text-align: left !important; } div.header-nav-item a{ display: inline-block; } .header-actions.header-actions--right { position: fixed; left: 5vw; bottom: 2vw; justify-content: flex-start !important; } .header-actions--right .header-actions-action a { margin-left: 0 !important; margin-right: 2.5vw; } #page article section.page-section { max-width: 75%; margin-left: 25%; padding-top: 0 !important; }} }