Contents

Techno comes in three presets: Techno, Flagship and Datasheet. Each has its own listing on the Shopify Theme Store and its own demo store, and each installs its own home page, product page, header and footer. They're the same theme underneath: every section, block and setting is in all three, so anything one preset does, another can do after a few changes in the theme editor.

Which preset to choose

  • Techno, for a consumer tech and accessories store with a few dozen products: the terminal look, with a dark palette, the system monospace font and the boot sequence.
  • Flagship, for a brand built around one main product and a few accessories, such as a keyboard or an audio device: a light, calm page that tells the product's story, with room for its parts and questions.
  • Datasheet, for a large catalog of parts, components or tools, with buyers who order in quantity: a wide, dense page on a drafting grid, with a mega menu, long product lists and the spec table directly under the price.

What each preset sets

Theme settings:

SettingTechnoFlagshipDatasheet
Colors › "Color palette"TechnoMonolithBlueprint
Typography › "Primary font"System monospaceIBM Plex MonoIBM Plex Sans Condensed
Typography › "Base text size"14 px15 px14 px
Layout › "Page width"MediumNarrowWide
Layout › "Page margin"18 px18 px14 px
Motion and effects › "Show grid overlay"OffOffOn
Motion and effects › "Show boot sequence on load"OnOffOff
Copy › "Show system chatter in copy"OnOffOff
Commerce › "Show currency code"OffOffOn
Product cardsNo quick view or quick add"Show quick add button" and "Show second image on hover" on"Show quick view button" and "Show quick add button" on
Navigation › "Position" (back-to-top button)LeftRightLeft

No preset changes a single color, so each uses its palette exactly as Colors & palettes describes. Flagship and Datasheet load a font from Shopify's library, with its bold, italic and bold italic styles; Techno uses the visitor's own monospace font, which needs no download.

Pages, header and footer:

TechnoFlagshipDatasheet
Home pageHero, Featured collection, Kits, NewsletterHero, Featured product, Schematic, two Image with text sections, Kits, FAQ, Featured collection "Accessories", NewsletterHero, three Featured collections ("In the catalog", "Components", "Tools"), Kits, Image with text, Rich text, Newsletter
Product pageProduct, with the vendor line and the spec table after the description, and two rows of recommendationsProduct without the vendor line, an Image with text section, and complementary recommendations "Accessories"Product with the spec table, barcodes included, directly under the price, a Quick order list, complementary recommendations "Pairs well with" and related "Related parts"
Collection and search pages12 products a page12 products a page36 products a page; collection cards show the vendor
HeaderMega menu, status strip with "Uplink", your product count and the free dispatch noteDropdown menu, the header hides as shoppers scroll down, status strip with your product countMega menu, status strip with your product count and the free shipping note
FooterNewsletter, a menu, social linksNewsletter, a menu, social linksTwo menus, a text column, newsletter, social links

The header and footer menus use your store's main menu and footer menu, which every Shopify store has. Sections that show products or collections start empty, apart from Techno's "Top of stack" and Datasheet's "In the catalog" rows, which show all your products, and the recommendation rows, which Shopify fills: they show placeholder cards on your storefront and a hint in the theme editor until you choose what goes in them. The Schematic and Image with text sections show a placeholder drawing until you add an image.

No preset promises shipping, returns, a warranty, delivery times or a reply time. The free shipping note in the header and cart stays hidden until you set Theme settings › Commerce › "Free dispatch over", and the text each preset ships describes what the section is for until you write your own.

Switching preset or palette

There are two settings with similar names, and they do different things:

  • Theme settings › Colors › "Color palette" changes the ten colors and nothing else. Switch palettes here at any time. See Colors & palettes.

  • Theme settings › Theme style, the entry Shopify adds at the bottom of Theme settings, lists the three presets. Choosing one applies every theme setting the preset sets: everything in the first table above, and also these, which every preset sets the same way:

    • the ten colors below Colors › "Color palette", which every preset leaves empty, so any color you changed goes back to following the palette;
    • Navigation › "Show back-to-top button", on;
    • Brand › "Use a custom logo", off, and "Logo width", 180 px;
    • Motion and effects › "Show scanline overlay", off;
    • Commerce › "Free dispatch over", 0;
    • Product cards › "Show swatches", off, and "Swatches before "+" count", 5.

    It overwrites your changes to all of them, so after switching, set your own colors again, turn "Use a custom logo" back on, turn the back-to-top button, the scanline overlay or swatches back to how you had them, and re-enter your free shipping amount. Your text and images, including the logo image itself, stay.

Choosing a theme style doesn't change your pages, header or footer. Those come with a preset only when you add Techno from that preset's Theme Store listing. To use another preset's pages later, add its sections in the theme editor, using the second table above as the list, or add that preset as a second theme and copy what you want from it.

See also