-
Posts
66,987 -
Joined
-
Last visited
-
Days Won
537
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Everything posted by tuanphan
-
Remove navigation menu but leave logo
tuanphan replied to Colandovision's topic in Customize with code
Do you enable announcement bar?- 23 replies
-
- custom-css
- navigation
-
(and 2 more)
Tagged with:
-
Remove navigation menu but leave logo
tuanphan replied to Colandovision's topic in Customize with code
Try this code /* Remove nav desktop */ .homepage div#headerNav { display: none !important; } /* Remove nav mobile */ .homepage .mobile-nav-toggle { display: none; }- 23 replies
-
- custom-css
- navigation
-
(and 2 more)
Tagged with:
-
Remove navigation menu but leave logo
tuanphan replied to Colandovision's topic in Customize with code
Add my code in HOME > DESIGN > CUSTOM CSS Do not edit anything in the code I sent- 23 replies
-
- custom-css
- navigation
-
(and 2 more)
Tagged with:
-
Remove navigation menu but leave logo
tuanphan replied to Colandovision's topic in Customize with code
@Colandovision Where did you insert?- 23 replies
-
- custom-css
- navigation
-
(and 2 more)
Tagged with:
-
@maygenhiser Add to Home > Design > Custom CSS .yui3-squarespacecalendar .flyoutitemlist { background: #fff; }
- 16 replies
-
- calendar
- events-page
-
(and 1 more)
Tagged with:
-
Remove navigation menu but leave logo
tuanphan replied to Colandovision's topic in Customize with code
@Colandovision Add to Home > Design > Custom CSS /* Remove nav desktop */ div#headerNav { display: none !important; } /* Remove nav mobile */ .mobile-nav-toggle { display: none; }- 23 replies
-
- custom-css
- navigation
-
(and 2 more)
Tagged with:
-
Remove navigation menu but leave logo
tuanphan replied to Colandovision's topic in Customize with code
You need to share your site url or template name.- 23 replies
-
- custom-css
- navigation
-
(and 2 more)
Tagged with:
-
Product Title Font Size on Mobile View
tuanphan replied to SarahElizah's topic in Customize with code
If you don't share link, it is difficult. @SarahElizah -
Product Title Font Size on Mobile View
tuanphan replied to SarahElizah's topic in Customize with code
@SarahElizah Can you share link to your site? -
Add to Home > Design > Custom CSS /* Mobile */ @media screen and (max-width:640px) { td.has-event { background: gold !important; } td.has-event * { color: white !important; } } I think gold on desktop isn't good....
-
@caro426 Add to Home > Design > Custom CSS div#mobileMenuLink a:before { content: ""; background-image: url(https://image.flaticon.com/icons/svg/1279/1279537.svg); background-repeat: no-repeat; background-size: contain; background-position: center center; width: 30px; height: 30px; display: inline-block; visibility: visible; } #mobileMenuLink a { visibility: hidden; } Replace https...svg to icon you want. Reference: https://beaverhero.com/wells-squarespace/#Change_Menu_to_Hamburger_Icon
-
Close Hamburger menu after clicking link to ID on page
tuanphan replied to RaviB's topic in Customize with code
Did you solve? If nav has only 2 items, you can disable mobile menu, replace with desktop menu -
Version 7.1 help needed- different logos on different pages
tuanphan replied to basakatac's topic in Site Design & Styles
@basakatac you can insert this code to Page Settings > Advanced > Header <script> window.onload = function() { document.querySelectorAll('.header-title-logo img')[0].src = 'https://truyencv.com/images/no_avatar.jpg'; }; </script> Repalce https:///.jpg with new logo image url.- 15 replies
-
- custom-css
- logo
-
(and 1 more)
Tagged with:
-
Difficult. Thinking.....
-
that code for only desktop & tablet (min-width:641px) that code for only homepage (.homepage)
-
Add to Home > Design > Custom CSS @media screen and (min-width:641px) { .homepage { background-image: url(https://beaverhero.com/wp-content/uploads/2019/10/boost-generatepress.png); background-size: cover; background-position: center center; background-repeat: no-repeat; } } Replace your image url.
-
You're welcome. Reference:
-
(Updated: SS 7.1) Some custom code (CSS) to change color Navigation Link Navigation Hover Link Navigation Active Link >> 92 Templates Navigation Custom Font Notes Add code to Home > Design > Custom CSS The code is based on demo at squarespace.com/templates, so they may not work for some websites or navigation with dropdown If the code doesn't work, try adding !important to after, eg: color: #f1f2f3 !important; If you have any questions/found issues, just comment below or send me a private message. Thanks. Avenue Template /* Nav item color */ .main-nav ul li a { color: #ff0000 !important; } /* Nav item hover color */ .main-nav ul li a:hover { color: violet !important; } /* Nav item active color */ .main-nav ul li.active-link a { color: green !important; } Aviator /* Nav item color */ nav#main-navigation ul li a { color: #ff0000 !important; } /* Nav item hover color */ nav#main-navigation ul li a:hover { color: violet !important; } /* Nav item active color */ nav#main-navigation ul li.active-link a { color: green !important; } Bedford Family: Anya, Bedford, Bryant, Hayden, Bedford /* Nav item color */ #mainNavigation div a { color: #ff0000 !important; } /* Nav item hover color */ #mainNavigation div a:hover { color: violet !important; } /* Nav item active color */ #mainNavigation div.active a { color: green !important; } Brine Family: Aria, Basil, Blend, Brine, Burke, Cacao, Clay, Custom Template, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Lincoln, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West, Brine. /* Nav item color */ .Header-nav-item { color: #ff0000 !important; } /* Nav item hover color */ .Header-nav-item:hover { color: violet !important; } /* Nav item active color */ .Header-nav-item--active { color: green !important; } Farro: Farro, Haute Same as Brine Five /* Nav item color */ nav#main-navigation ul li a { color: #ff0000 !important; } /* Nav item hover color */ nav#main-navigation ul li a:hover { color: violet !important; } /* Nav item active color */ nav#main-navigation ul li.active-link a { color: green !important; } Flatiron /* Nav item color */ ul#nav li a { color: #ff0000 !important; } /* Nav item hover color */ ul#nav li a:hover { color: violet !important; } /* Nav item active color */ ul#nav li.active-link a { color: green !important; } Forte /* Nav item color */ #topNav ul li a span { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover span { color: violet; } /* Nav item active color */ #topNav ul li.active-link a span { color: green !important; } Ishimoto /* Nav item color */ #topNav #nav li a { color: #ff0000; } /* Nav item hover color */ #topNav #nav li a:hover { color: violet; } /* Nav item active color */ #topNav #nav li.active-link a { color: green !important; } Momentum /* Nav item color */ #topNav ul li a { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover { color: violet; } /* Nav item active color */ #topNav ul li.active-link a { color: green; } Montauk: Julia, Kent, Montauk, OM Same as Momentum Native /* Nav item color */ #navBlock ul li a { color: #ff0000 !important; } /* Nav item hover color */ #navBlock ul li a:hover { color: violet !important; } /* Nav item active color */ #navBlock ul li.active-link a { color: green !important; } Pacific: Bryler, Charlotte, Fulton, Horizon, Naomi, Pacific /* Nav item color */ #mainNavigation div a { color: #ff0000 !important; } /* Nav item hover color */ #mainNavigation div a:hover { color: violet !important; } /* Nav item active color */ #mainNavigation div.active a { color: green !important; } Skye: Foundry, Indigo, Ready, Skye, Tudor /* Nav item color */ .nav-blocks-wrapper div a span { color: #ff0000; } /* Nav item hover color */ .nav-blocks-wrapper div a:hover span { color: violet; } /* Nav item active color */ #mainNavigation div.nav-link--active a { color: green !important; } Tremont: Camino, Carson, Henson, Tremont /* Nav item color */ #mainNavigation div a span { color: #ff0000; } /* Nav item hover color */ #mainNavigation div a:hover span { color: violet; } /* Nav item active color */ #mainNavigation div.active a span { color: green; } Wells /* Nav item color */ div#topNav ul li a { color: #ff0000 !important; } /* Nav item hover color */ div#topNav ul li a:hover { color: violet !important; } /* Nav item active color */ div#topNav ul li.active-link a { color: green !important; } Wexley /* Nav item color */ #topNav ul li a { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover { color: violet; } /* Nav item active color */ #topNav ul li.active-link a { color: green; } York: Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, Taylor, York /* Nav item color */ .site-navigation div a span { color: #ff0000; } /* Nav item hover color */ .site-navigation div a:hover span { color: violet; } /* Nav item active colo */ .site-navigation div.active a span { color: green; } Squarespace 7.1 /* Nav item color */ .header-nav-item a { color: #ff0000 !important; } /* Nav item hover color */ .header-nav-item>a:hover { color: red !important; } .header-nav-folder-item:hover a { color: red !important; } /* Nav item active color */ .header-nav-item--active a { color: green !important; } Created by Tuan Phan. Share to be shared more.
- 114 replies
-
- navigation-link
- color
-
(and 1 more)
Tagged with:
-
@LivAils Add to Home > Design > Custom CSS /* Hover */ nav.main-nav a:hover { border-bottom: 1px solid currentColor !important; } /* Active */ nav.main-nav .active-link a { border-bottom: 1px solid currentColor; } You can also use text-decoration: underline; but i like border-bottom
-
@marmar Add to Home > Design > Custom CSS .sqs-block-content a { font-weight: bold; border-bottom-width: 3px !important; }
-
@marmar Can you share link to your site, and which text block do you want to change link color?
-
Moving banner text to bottom left Hayden template
tuanphan replied to BobCarver's topic in Customize with code
@BobCarver .desc-wrapper { margin: 0px; text-align: left !important; width: 50% !important; padding-top: 64px; padding-bottom: 0; } -
Logo loading screen - code adjustment please
tuanphan replied to rdreed's topic in Customize with code
@rdreed Try Style & Script code: Page Settings > Advanced > Insert the code to Header And insert this code to bottom of page (you can use Markdown Block or Code Block to insert) <div class="logoload"></div>- 39 replies
-
- code-injection
- logo
-
(and 1 more)
Tagged with:
-
Logo loading screen - code adjustment please
tuanphan replied to rdreed's topic in Customize with code
@rdreed Your code <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <div class="logoload"></div> <style> .logoload { /* SET BACKGROUND COLOR */ background-color: #fff; /* SET BACKGROUND SIZE */ background-size: 90px; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background-position: center; background-repeat: no-repeat; background-image: url("https://static1.squarespace.com/static/5d9db9630e0cb109b5331185/t/5db877bc05d8093cb6fbfe15/1572370384602/mrnice-smiley.gif"); } </style> <script type="text/javascript"> $(window).load(function() { $(".logoload").delay(500).fadeOut("slow"); }) </script>- 39 replies
-
- code-injection
- logo
-
(and 1 more)
Tagged with:
-
@luke2 /* remove date single post */ .collection-type-blog.view-item .entry-dateline { display: none; } /* fix padding left */ .collection-type-blog.view-item .entry-morefrom:before { display: none; }