Jump to content

tuanphan

Circle Member
  • Posts

    66,939
  • Joined

  • Last visited

  • Days Won

    536

Everything posted by tuanphan

  1. Try this code /* Remove nav desktop */ .homepage div#headerNav { display: none !important; } /* Remove nav mobile */ .homepage .mobile-nav-toggle { display: none; }
  2. Add my code in HOME > DESIGN > CUSTOM CSS Do not edit anything in the code I sent
  3. @maygenhiser Add to Home > Design > Custom CSS .yui3-squarespacecalendar .flyoutitemlist { background: #fff; }
  4. @Colandovision Add to Home > Design > Custom CSS /* Remove nav desktop */ div#headerNav { display: none !important; } /* Remove nav mobile */ .mobile-nav-toggle { display: none; }
  5. If you don't share link, it is difficult. @SarahElizah
  6. @SarahElizah Can you share link to your site?
  7. 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....
  8. @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
  9. Did you solve? If nav has only 2 items, you can disable mobile menu, replace with desktop menu
  10. @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.
  11. that code for only desktop & tablet (min-width:641px) that code for only homepage (.homepage)
  12. 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.
  13. (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.
  14. @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
  15. @marmar Add to Home > Design > Custom CSS .sqs-block-content a { font-weight: bold; border-bottom-width: 3px !important; }
  16. @marmar Can you share link to your site, and which text block do you want to change link color?
  17. @BobCarver .desc-wrapper { margin: 0px; text-align: left !important; width: 50% !important; padding-top: 64px; padding-bottom: 0; }
  18. @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>
  19. @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>
  20. @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; }
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.