Advanced Customization: HTML, CSS, JS

Despite the powerful controls available to manipulate the look and function of your online storefront, sometimes you just need to hide or restyle something and there’s not a setting or configuration option directly for it.

In addition to all the backend database and scripting, your AutoPrint storefront uses a combination of standard web page technologies to define and control the way elements on the page appear and, to some degree, interact.

So, learning a little HTML, CSS, and javascript, or finding someone you can depend upon to help you make some of these changes might go a long way. The further you go down the list, the more complex the languages and their usage gets.

Here’s some recommended resources to learn the basics of each of these technologies:

HTML (or Hyper Text Markup Language)
https://www.w3schools.com/html/

CSS (or Cascading Style Sheets)
https://www.w3schools.com/css

JS (or Javascipt)
https://www.w3schools.com/js

Sometimes, in order for changes you make to show up on the actual storefront you have to hard refresh the page to reload images and style files. Here’s an article about how to do that:

https://www.documate.org/resources/what-is-a-hard-refresh-how-to-do-a-hard-refresh-in-any-browser

And, one more invaluable tool you’ll want to know about is the Chrome (or Firefox) inspector tool. Here’s a quick video to show you how to use it to find an element of HTML, create CSS to hide it, then add the HTML/CSS rule you create to your theme’s global CSS file.