Ecommerce e vendita al dettaglioSearch Marketing

Shopify: come programmare titoli di temi dinamici e meta descrizioni per SEO utilizzando Liquid

Se hai letto i miei articoli negli ultimi mesi, noterai che ho condiviso molto di più sull'e-commerce, soprattutto per quanto riguarda Shopify:. La mia azienda sta costruendo un sistema altamente personalizzato e integrato Shopify Plus sito per un cliente. Invece di spendere mesi e decine di migliaia di dollari per creare un tema da zero, abbiamo convinto il cliente a consentirci di utilizzare un tema ben costruito e supportato che è stato provato e testato. Siamo andati con Wokiee, un tema Shopify multiuso che ha un sacco di funzionalità.

Ci sono voluti ancora mesi di sviluppo per incorporare la flessibilità di cui avevamo bisogno in base alle ricerche di mercato e al feedback dei nostri clienti. Al centro dell'implementazione c'era un produttore di moda che desiderava creare un sito di e-commerce diretto al consumatore in cui le donne potessero acquistare facilmente abiti online.

Poiché Wokiee è un tema multiuso, un'area su cui ci concentriamo molto è l'ottimizzazione per i motori di ricerca. Nel tempo, riteniamo che la ricerca organica rappresenterà il costo per acquisizione più basso e gli acquirenti con la massima intenzione di acquistare. Nella nostra ricerca, abbiamo identificato che le donne acquistano abiti con 5 influencer decisionali chiave:

  • Stili di vestiti
  • Colori dei vestiti
  • I prezzi degli abiti
  • Spedizione Gratuita
  • Resi senza problemi

I titoli e le meta descrizioni sono fondamentali a ottenere i tuoi contenuti indicizzati e visualizzati correttamente. Quindi, ovviamente, vogliamo un tag title e meta descrizioni che contengano quegli elementi chiave!

  • Le tag title nell'intestazione della tua pagina è fondamentale per garantire che le tue pagine siano indicizzate correttamente per le ricerche pertinenti.
  • Le meta description viene visualizzato nelle pagine dei risultati dei motori di ricerca (SERP) che forniscono informazioni aggiuntive che invogliano l'utente della ricerca a fare clic.

La sfida è che Shopify condivide spesso titoli e meta descrizioni su diversi modelli di pagina: home, raccolte, prodotti, ecc. Quindi, ho dovuto scrivere una logica per popolare dinamicamente i titoli e le meta descrizioni in modo corretto.

Ottimizza il titolo della tua pagina Shopify

La lingua del tema di Shopify è liquido ed è abbastanza buono. Non entrerò in tutti i dettagli della sintassi, ma puoi generare dinamicamente un titolo di pagina abbastanza facilmente. Una cosa che devi tenere a mente qui è che i prodotti hanno varianti... quindi incorporare varianti nel titolo della pagina significa che devi scorrere le opzioni e costruire dinamicamente la stringa quando il modello è un PRODOTTI modello.

Ecco un esempio di titolo per a vestito maglione scozzese.

<title>Plaid Sweater Dress on sale today for $78.00 » Multi Knee-Length » Closet52</title>

Ed ecco il codice che produce quel risultato:

{%- capture seo_title -%}
    {%- if template == "collection" -%}{{ "Order " }}{%- endif -%}
    {{- page_title -}}
    {%- if template == "collection" -%}{{ " Online" }}{%- endif -%}
    {% assign my_separator = " » " %}
    {%- if current_tags -%}{%- assign meta_tags = current_tags | join: ', ' -%}
      {%- if template == 'blog' -%} 
      {{ " Articles" }} {%- if current_tags -%}{{ 'general.meta.tags' | t: tags: meta_tags | capitalize | remove: "&quot;" -}}{%- endif -%}
      {%- else -%}
      {{ my_separator }}{{ 'general.meta.tags' | t: tags: meta_tags -}}
      {%- endif -%}
    {%- endif -%}
    {%- if current_page != 1 -%}{{ my_separator }}{{ 'general.meta.page' | t: page: current_page }}{%- endif -%}
    {%- if template == "product" -%}{{ " only " }}{{ product.variants[0].price | money }}{{ my_separator }}{% for product_option in product.options_with_values %}{% if product_option.name == 'Color' %}{{ product_option.values | join: ', ' }}{% endif %}{% endfor %}{% if product.metafields.my_fields.dress_length != blank %} {{ product.metafields.my_fields.dress_length }}{%- endif -%}{%- endif -%}
    {% if template == "collection" %}{{ my_separator }}Free Shipping, No-Hassle Returns{% endif %}{{ my_separator }}{{ shop.name }}
  {%- endcapture -%}

<title>{{ seo_title | strip_newlines }}</title>

Il codice si suddivide in questo modo:

  • Titolo della pagina – incorporare prima il titolo effettivo della pagina... indipendentemente dal modello.
  • tag – incorporare i tag unendo i tag associati a una pagina.
  • Colori di prodotti – scorrere le opzioni di colore e creare una stringa separata da virgole.
  • metacampi – questa istanza di Shopify ha la lunghezza del vestito come metafield che desideriamo includere.
  • Prezzo – includi il prezzo della prima variante.
  • Nome negozio – aggiungi il nome del negozio alla fine del titolo.
  • Separatore – invece di ripetere il separatore, lo rendiamo semplicemente un'assegnazione di stringa e lo ripetiamo. In questo modo, se decidiamo di cambiare quel simbolo in futuro, è solo in un posto.

Ottimizza la meta descrizione della tua pagina Shopify

Quando abbiamo eseguito la scansione del sito, abbiamo notato che qualsiasi pagina del modello di tema richiamata ripeteva le impostazioni SEO della home page. Volevamo aggiungere una meta descrizione diversa a seconda che la pagina fosse una home page, una pagina delle collezioni o la pagina del prodotto reale.

Se non sei sicuro di quale sia il nome del tuo modello, aggiungi semplicemente una nota HTML nel tuo theme.liquid file ed è possibile visualizzare l'origine della pagina per identificarla.

<!-- Template: {{ template }} -->

Questo ci ha permesso di identificare tutti i modelli che utilizzavano la meta descrizione del sito in modo da poter modificare la meta descrizione in base al modello.

Ecco la meta descrizione che vogliamo nella pagina del prodotto sopra:

<meta name="description" content="Turn heads in this classic hunter green plaid sweater dress. Modern updates make it a must-have: the stand-up neckline, three-quarter sleeves and the perfect length. On sale today for $78.00! Always FREE 2-day shipping and no-hassle returns at Closet52.">

Ecco quel codice:

  {%- capture seo_metadesc -%}
  	{%- if page_description -%}
  	  {%- if template == 'list-collections' -%}
  			{{ "Find a beautiful dress for your next occasion. Here are all of our beautiful dress collections." | strip }}
      {%- else -%}
          {{- page_description | strip | escape -}} 
          {%- if template == 'blog' -%}
          {{ " Here are our articles" }} {%- if current_tags -%}{{ 'general.meta.tags' | t: tags: meta_tags | downcase | remove: "&quot;" -}}{%- endif -%}.
          {%- endif -%}
          {%- if template == 'product' -%}
  			{{ " Only " }}{{ product.variants[0].price | money }}!
  		  {%- endif -%}
      {%- endif -%}   	
  	{%- endif -%}
    {%- if template == 'collection' -%}
            {{ "Find a beautiful dress for your next occasion by color, length, or size." | strip }}
    {%- endif -%}
    {{ " Always FREE 2-day shipping and no-hassle returns at " }}{{ shop.name | strip }}.
  {%- endcapture -%}

<meta name="description" content="{{ seo_metadesc | strip_newlines }}">

Il risultato è un insieme dinamico e completo di titoli e meta descrizioni per qualsiasi tipo di modello o pagina di prodotto dettagliata. Andando avanti, molto probabilmente effettuerò il refactoring del codice utilizzando case statement e lo organizzerò un po' meglio. Ma per ora, sta producendo una presenza molto più gradevole nelle pagine dei risultati dei motori di ricerca.

Divulgazione: sono un affiliato di Shopify: ed ThemeForest e sto usando quei collegamenti in questo articolo. Closet52 era un cliente della mia azienda, DK New Media. Se desideri assistenza per sviluppare la tua presenza e-commerce utilizzando Shopify, per favore CONTATTACI.

Douglas Karr

Douglas Karr è CMO di ApriINSIGHTS e il fondatore della Martech Zone. Douglas ha aiutato dozzine di startup MarTech di successo, ha assistito nella due diligence di oltre 5 miliardi di dollari in acquisizioni e investimenti Martech e continua ad assistere le aziende nell'implementazione e nell'automazione delle loro strategie di vendita e marketing. Douglas è un esperto e relatore di trasformazione digitale e MarTech riconosciuto a livello internazionale. Douglas è anche autore di una guida per manichini e di un libro sulla leadership aziendale.

Articoli Correlati

Torna a pulsante in alto
Chiudi

Blocco annunci rilevato

Martech Zone è in grado di fornirti questi contenuti gratuitamente perché monetizziamo il nostro sito attraverso entrate pubblicitarie, link di affiliazione e sponsorizzazioni. Ti saremmo grati se rimuovessi il blocco degli annunci mentre visiti il ​​nostro sito.