SolveigTraeet Posted January 4, 2021 Share Posted January 4, 2021 (edited) Site URL: https://caper-badger-3s6d.squarespace.com Hi! I want to add an image (custommade in Adobe Illustrator) to each page link on my navigation menu. How do I do that? Can someone help me with this? Edited January 11, 2021 by SolveigTraeet Link to comment
tuanphan Posted January 6, 2021 Share Posted January 6, 2021 Hi. Can you provide access password? SolveigTraeet 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SolveigTraeet Posted January 6, 2021 Author Share Posted January 6, 2021 Hi @tuanphan! the access password is: home Link to comment
tuanphan Posted January 7, 2021 Share Posted January 7, 2021 17 hours ago, SolveigTraeet said: Hi @tuanphan! the access password is: home Discover..item or discover + both dropdown items? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SolveigTraeet Posted January 11, 2021 Author Share Posted January 11, 2021 (edited) @tuanphan Can you help me? What my dropdown menu looks like now: After: What I want the dropdown menu to look like: bigger and centered, with my brand icons/titles. Edited January 11, 2021 by SolveigTraeet Link to comment
tuanphan Posted January 13, 2021 Share Posted January 13, 2021 Add to Design > Custom CSS /* Folder menu */ .header-nav-folder-content { left: 50% !important; transform: translateX(-50%); width: 350px !important; } .header-nav-folder-item [href="/about"]:before { content: ""; background-image: url(https://beaverhero.com/wp-content/uploads/2019/08/montauk-squarespace.jpg); background-size: contain; display: inline-block; background-position: left center; width: 20px; height: 20px; margin-right: 5px; } Repeat & change /about to other urls. SolveigTraeet 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SolveigTraeet Posted January 13, 2021 Author Share Posted January 13, 2021 @tuanphan Thank you so much! Link to comment
SolveigTraeet Posted January 13, 2021 Author Share Posted January 13, 2021 (edited) @tuanphan Can you help me further? 1. How do I place custom icons, with links to websites, at the bottom of my menu centered (like on the attached picture above)? 2. How to make the pagelinks custommade images (like you see on picture above)? 3. How to make the icons next to pagelinks bigger (if I make the pixel bigger in the code you gave me, the image just multiplies, instead of getting bigger)? Edited January 16, 2021 by SolveigTraeet Link to comment
tuanphan Posted January 17, 2021 Share Posted January 17, 2021 On 1/13/2021 at 7:38 PM, SolveigTraeet said: @tuanphan Can you help me further? 1. How do I place custom icons, with links to websites, at the bottom of my menu centered (like on the attached picture above)? 2. How to make the pagelinks custommade images (like you see on picture above)? 3. How to make the icons next to pagelinks bigger (if I make the pixel bigger in the code you gave me, the image just multiplies, instead of getting bigger)? 1. 2. Answered in other post 3. Try new code /* Folder menu */ .header-nav-folder-content { left: 50% !important; transform: translateX(-50%); width: 350px !important; } .header-nav-folder-item [href="/about"]:before { content: ""; background-image: url(https://beaverhero.com/wp-content/uploads/2019/08/montauk-squarespace.jpg); background-size: contain; display: inline-block; background-position: left center; background-repeat: no-repeat; width: 20px; height: 20px; margin-right: 5px; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SolveigTraeet Posted January 17, 2021 Author Share Posted January 17, 2021 @tuanphan That did the trick, thank you! But can you help me further? If you see attached picture, The pagelinks and the icons next to them are all over the place. Can you help me make the icons and pagelinks closer to each other? - Move icons more to left - Move pagelinks more to left, and upwards to the center of the icons (see picture attached at bottom) This is what I want it to look, can you help me?: Link to comment
tuanphan Posted January 18, 2021 Share Posted January 18, 2021 14 hours ago, SolveigTraeet said: @tuanphan That did the trick, thank you! But can you help me further? If you see attached picture, The pagelinks and the icons next to them are all over the place. Can you help me make the icons and pagelinks closer to each other? - Move icons more to left - Move pagelinks more to left, and upwards to the center of the icons (see picture attached at bottom) This is what I want it to look, can you help me?: Remove space withing image. Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
SolveigTraeet Posted January 18, 2021 Author Share Posted January 18, 2021 (edited) @tuanphan Thank you for replying, but I don't understand how I remove space within images. Edited January 19, 2021 by SolveigTraeet Link to comment
tuanphan Posted January 20, 2021 Share Posted January 20, 2021 On 1/18/2021 at 5:49 PM, SolveigTraeet said: @tuanphan Thank you for replying, but I don't understand how I remove space within images. Edit images with AI, Photoshop, before uploading to your site. SolveigTraeet 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
creedon Posted January 21, 2021 Share Posted January 21, 2021 For those on macOS if you just need to do simple image manipulations cropping, resizing etc. You can use Apple's Preview application. It comes with the OS. 🙂 tuanphan 1 Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment