sastavangogh
Member-
Posts
41 -
Joined
-
Last visited
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Everything posted by sastavangogh
-
Hi @tuanphan! I am trying to achieve a similar effect with a separate social link block, I have a personal plan as well so I tried this code but I need to use it for my Behance and Vimeo accounts - how can I include the social icons for these two platforms?
- 43 replies
-
- social-sharing
- social-links
-
(and 1 more)
Tagged with:
-
Back to Top link in footer not getting center-aligned
sastavangogh replied to sastavangogh's topic in Customize with code
Amazing, thank you that really worked!! Is there any way I can remove the word "Top" and just have it just be the arrow for the scroll up? -
Back to Top link in footer not getting center-aligned
sastavangogh replied to sastavangogh's topic in Customize with code
Hi @tuanphan! The centre-alignment helped, but now there is a lot of empty space under the footer that I cannot seem to get rid of. I had changed the position property of the text to relative to get the placement correct, perhaps that has created an issue? Sharing code below: <a href="#top" class="t-top"><span class="arrow"></span>Top</a> <style> .t-top { font-weight: 300; letter-spacing: 3px; font-size: 14px; text-transform: none; text-align: center; line-height: 1.6; padding-left: 4px; padding-top: 4px; position: relative; bottom: 10px; height: 10px; z-index: 999; background-color: transparent; color: #000; } .t-top .arrow:before { font-family: 'squarespace-ui-font'; font-style: normal; font-weight: 300; font-size: 20px; line-height: 1; -webkit-font-smoothing: antialiased; content: "\e02d"; text-align: center; display: block; vertical-align: middle; transform: rotate(-90deg); cursor: pointer; margin-left: -4px; } .t-top .arrow {display:inline; } </style> In order to fix this, I am looking to reduce the footer height by half at least (without moving the centre aligned position of the 'back to top' button) I dont mind removing the text altogether and only keeping the arrow scrolling back to the top of the page, would that help the situation? Please help me figure this out, I have tried all possible codes I've found across on similar threads but none seem to help 😕 PW tester -
Thanks for the code! I followed all the steps you mentioned above. However, the black background applies to the full body of text too, thus making it invisible. It only needs to apply to just the anchor link text, how can I fix that please? Screenshot attached.
-
Hi this works for the LTR transition when I change the background to black! But the text colour wont change to white even when I add "color: #ffffff!important;"? How can I bring the text on top of the black background in the colour white (on hover)?
-
Yeah sure! Its on the homepage, right under the opening slideshow - I want to add a couple more anchor links in this section once the LTR transition works. Screenshot attached for reference. PW tester
-
Hi I am still looking for an answer to this, if anyone could help me out with the CSS for this that would be really great. Thanks!
-
Some anchor links scrolling too far on mobile 7.1 site
sastavangogh replied to CAKelly's topic in Customize with code
Hi! Could you please share how you fixed the anchor links on mobile view? I have the exact same issue with my homepage anchor links! -
@bangank36, hi - wanted to check with you if you could help me out with this? Any help would be appreciated, thanks!
-
Back to Top link in footer not getting center-aligned
sastavangogh replied to sastavangogh's topic in Customize with code
Hi, I tried a similar code and it works! But the problem is that the footer's overall height increases a lot when I put this code. Any chance I can avoid/fix the height of the footer to normal? -
Adding a Code for 'Scroll down' arrow on top of a gallery
sastavangogh replied to sastavangogh's topic in Customize with code
Hi @tuanphanit is a little to the right if you look closely, any way to center it to the screen properly? I've attached a screenshot for better clarity. -
Adding a Code for 'Scroll down' arrow on top of a gallery
sastavangogh replied to sastavangogh's topic in Customize with code
Hi @tuanphan, thanks for helping me out with the scroll down indicator a couple months ago (and since!). But I've just come to realise that the arrow is not center aligned on mobile. I've tried numerous codes from similarly answered questions on the forum, but none have seemed to work. Would you know how to center align the indicator on mobile devices as well? Thanks. PW tester -
Back to Top link in footer not getting center-aligned
sastavangogh replied to sastavangogh's topic in Customize with code
Hey the password is tester. Thanks! -
Hey, a follow up question: I am trying to apply a similar hover animation to anchor links on the homepage, where in when you hover on the links, the background color changes as a transition from left to right. *Currently the links have been customised to have a ##f6ffed background and no underline; on hover, the links' font color changes to white, background colour to black. How can I add the above mentioned LTR transition to the links? *Code for the above: h2 a { text-decoration: none!important; background: #f6ffed; padding-left: 3px; padding-right: 3px; padding-bottom:1px; } h2 a:hover{ background: #000000!important; color: #ffffff!important; padding-left: 3px; padding-right: 3px; padding-bottom:1px; }
-
Back to Top link in footer not getting center-aligned
sastavangogh replied to sastavangogh's topic in Customize with code
Hi @bangank36, could you help me centre-align the 'Back to Top' arrow in a way that the footer height does not increase beyond the default? Thank you -
Site URL: https://www.aditya-sinha.com/ Hi @tuanphan, I followed your link (https://beaverhero.com/back-to-top-squarespace/) to create a back to top arrow on my page. However, it does not seem to centre align properly. I've added <center></center> to the code as well and here is the customized CSS I put into the Design tab: /* Back to Top */ .t-top { font-weight: 300; letter-spacing: 3px; font-size: 14px; text-transform: none; text-align: center; line-height: 1.6; padding-left: 4px; padding-top: 4px; position: fixed; bottom: -10px; width: 100px; height: 40px; z-index: 999; background-color: transparent; color: #000; } .t-top .arrow:before { font-family: 'squarespace-ui-font'; font-style: normal; font-weight: 300; font-size: 20px; line-height: 1; -webkit-font-smoothing: antialiased; content: "\e02d"; text-align: center; display: block; vertical-align: middle; transform: rotate(-90deg); cursor: pointer; margin-left: -4px; } .t-top .arrow {display:inline; } Every time i change the position to static, the height of the footer increases. Could you help make the back to top button center aligned and not affect the height of the footer? Thanks!
-
Site URL: https://www.aditya-sinha.com/ Hi, I am looking to make the text on a blog page sticky, in order for it to stay on top of the page and serve as a sub-navigation for the blog posts below. I'm trying to achieve a similar Work page as is here: http://www.lauramccluskey.com/, with the categories/tags at the bottom of the page. Is there any method through Custom CSS and not Code Injection to possible achieve this? Password: tester
-
Thanks! However, I meant a transition delay in terms of animation of the bottom border (left to right). Sorry it if wasn't clearer in the previous response! Any way to do that?
-
Thans once again, @tuanphan! This has solved my issue 🙂 I was wondering how to edit this code to include a transition delay in the hover as well. Would that be possible?