Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

tcp13

Circle Member
  • Content Count

    330
  • Joined

  • Last visited

  • Days Won

    5

tcp13 last won the day on August 10 2020

tcp13 had the most liked content!

2 Followers

About tcp13

  • Rank
    Circle Leader

Personal Information

Recent Profile Visitors

1,106 profile views
  1. @ConradH Try adding this in Design > Custom CSS: @media only screen and (max-width: 768px) { a.sqs-block-button-element[href="javascript:window.print();"]{display:none!important;} } With this expected result: Hope this helps, -Tyler
  2. Ah, sorry about that @northamrealty! It appears your homepage has a different selector since it's an Index Page. Try modifying it one more time to target .Content-outer instead of .Index <!--Skip Link--> <script> $(document).ready(function(){$("body").prepend('<a href="javascript:skipTrigger();" class="skip-link" tabindex="0">Skip to Content</a>');}); function skipTrigger(){$(".Content-outer").attr("tabindex", "-1").focus();} </script> That should work on every page within your template (include the homepage too). Feel free to DM me if you encounter any
  3. Hey there @melbeestudio and @queerterpreter, Skip links are built-it to the newer 7.1 templates, but you have to add them with custom code for the older 7.0 templates. I posted a few different template-specific solutions in another thread here: Hope this helps! Feel free to send me a DM if you need further assistance. -Tyler PS - For whatever it's worth, I've written here about why Userway is a poor approach to accessibility. Sure, it adds a skip link, but the button is super ugly and it does very little to actually improve the user experience for people with disabilities 😉
  4. Hey @queerterpreter, I posted some custom code to add a skip link in a similar thread: Hope this helps! -Tyler
  5. Hey @GreggP, Lighthouse appears to be flagging the empty aria-labels on the social icons in your site footer. This has been a known issue on all Squarespace sites for quite some time. For a blind person using a screen reader (software that audibly announces the contents of the page), the purpose of these linked icons would be unclear. One way to fix this would be to replace the icons with linked text, as is suggested by Squarespace's accessibility guide here: That's a pretty lame solution though, so if you wanted to fix the existing icons, you could add correct aria-l
  6. Hey @CH1, What kind of "text to speech" program are you using? Screen readers (which visually impaired people use to announce site content), such as the widely-used JAWS, should be able to announce text without needing to use tab navigation. Adding a tabindex value is more applicable for buttons, links, and other interactive elements that a keyboard navigation user would use the tab key to access. If you're looking for additional accessibility help, feel free to send me a DM or check out the free accessibility audit tool linked in my signature below. Hope this helps! -Tyl
  7. Hey @StarBytes, Still having trouble with this? It's hard to guess without a link, but you may need to append !important; to your CSS rules like so: .gallery-item-description { font-size: 2rem !important; color: #fff !important; } And of the top of my head, it's possible you might instead need to target a descendant of the gallery description class: .gallery-item-description p { font-size: 2rem !important; color: #fff !important; } Hope this helps! -Tyler
  8. Hey @ch71579, Tyler here from SquareADA.com! Not sure about the SEO concerns or complex custom code mentioned in this tread, but to your original point about accessibility - the way it's setup is actually correct. If we dig into WCAG (that's the international standard on web accessibility), we see from Technique H30 that "When an image is the only content of a link, the text alternative for the image describes the unique function of the link." So in other words, for a summary block or grid of blog thumbnail images, it's more appropriate to describe the function of where that lin
  9. Hey there @northamrealty, It's actually a different target element for your template. Use the same code as above, but swap out this section with the following: <!--Skip Link--> <script> $(document).ready(function(){$("body").prepend('<a href="javascript:skipTrigger();" class="skip-link" tabindex="0">Skip to Content</a>');}); function skipTrigger(){$(".Index").attr("tabindex", "-1").focus();} </script> Hope this helps! -Tyler
  10. Hey there @kyledavis726 and @JTheater, Skip links are built-in to all of the newer Squarespace templates running version 7.1, but if you're using a older template running version 7.0, you'll have to implement one with custom code. In the case of the Westlake site you linked, try adding the following into Settings > Advanced > Code Injection > Header Injection: <!--jQuery--> <script src="https://code.jquery.com/jquery-3.5.0.min.js"></script> <!--Skip Link--> <script> $(document).ready(function(){$("body").prepend('<a href="javascript:sk
  11. hi, I was wondering if you could help

    I'm trying to reduce the space below Add to cart and additional information below, the website is in 7.1. I've asked in the forum but have not had any luck. thanks so much

    https://koala-recorder-yw4z.squarespace.com/shop/p/natural-unscented-soap-f57y9-ex9xd-ewghr?p

    1. tcp13

      tcp13

      Hey there @MyfWebb,

      Sure thing! Navigate to Design > Custom CSS and paste in the following code:

      .ProductItem-additional{margin-top:0px!important;}

      You can tweak the "0px" value to your liking (default was at 75px).

      Hope this helps!
      -Tyler

  12. You're close, @ConradH! Try targeting the img itself instead of its parent anchor element: /*change logo img src*/ .header-title-logo img { content: url('https://images.squarespace-cdn.com/content/v1/5fa318d8aa276a66ec5322fb/1609611984060-SAYWOSH6ATQYL3QJ5SU7/ke17ZwdGBToddI8pDm48kLkAmGt-nEc-KDyOz6MyEdx7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z4YTzHvnKhyp6Da-NYroOW3ZGjoBKy3azqku80C789l0slJ0ZK8bhnMvwBc9-o9uiV5bJKIkPq_14eERHvCXjNC_RY8ahIp3NZpEzceY_TM9w/Logo+Grey+V+Transparent.png') !important; } If we then remove the teal background, you're left with the new grey logo
  13. Hi @ConradH, I can't seem to find a way to reduce the page title sizing, but replacing your existing CSS with the following should keep the logo visible: /*PRINT FORMATTING*/ @media print { /*hide excess stuff*/ #footer, .sqs-block-button-container--left, #footer-sections { display: none !important; } /*hide nav bar*/ .header-nav, .header-actions { display: none !important; } /*add background color to logo since transparent on white is no bueno*/ #header, .header-inner{ background-color:#a6bdba!important; -webkit-print-color-adjust: exact !important;
  14. Sure thing @JSM - can you post a link to your site (and a page password if it's private)?
  15. Hi @northamrealty, It appears I posted the code for Brine with a screenshot of Bedford, so I'll assume that's an 11-month-old mistake on my part 🤦‍♂️ For your site, try adding the following within Design > Custom CSS: .Header-nav-folder:focus-within { opacity:1!important; display:block!important; visibility:visible!important; left:0px!important; } With this expected result: Hope this helps! If you're looking for a more substantial accessibility effort, checkout our free audit tool, which found 27 accessibility errors on your homepage 🙂 Feel free to se
×
×
  • Create New...