Shopify: लिक्विड वापरून एसइओसाठी डायनॅमिक थीम शीर्षके आणि मेटा वर्णन कसे प्रोग्राम करावे

Shopify टेम्पलेट लिक्विड - एसइओ शीर्षक आणि मेटा वर्णन सानुकूलित करा

जर तुम्ही माझे लेख गेल्या काही महिन्यांपासून वाचत असाल, तर तुमच्या लक्षात येईल की मी ईकॉमर्सबद्दल बरेच काही शेअर करत आहे, विशेषत: Shopify. माझी फर्म अत्यंत सानुकूलित आणि एकात्मिक तयार करत आहे शॉपिफाई प्लस क्लायंटसाठी साइट. सुरवातीपासून थीम तयार करण्यासाठी महिने आणि हजारो डॉलर्स खर्च करण्याऐवजी, आम्ही क्लायंटशी बोललो की आम्हाला एक सु-निर्मित आणि समर्थित थीम वापरण्याची परवानगी दिली आहे ज्याची चाचणी केली गेली आहे. आम्ही सोबत गेलो वॉकी, एक बहुउद्देशीय Shopify थीम ज्यामध्ये अनेक क्षमता आहेत.

मार्केट रिसर्च आणि आमच्या क्लायंटच्या फीडबॅकच्या आधारे आम्हाला आवश्यक असलेली लवचिकता समाविष्ट करण्यासाठी अद्याप अनेक महिने विकास आवश्यक आहे. अंमलबजावणीचा मुख्य भाग असा होता की Closet52 ही थेट-ग्राहक ई-कॉमर्स साइट आहे जिथे महिला सहजपणे सक्षम होतील ऑनलाइन कपडे खरेदी करा.

कारण वोकी ही एक बहुउद्देशीय थीम आहे, शोध इंजिन ऑप्टिमायझेशन या क्षेत्रावर आम्ही जास्त लक्ष केंद्रित करतो. कालांतराने, आमचा विश्वास आहे की सेंद्रिय शोध ही प्रति संपादन सर्वात कमी किंमत असेल आणि खरेदी करण्याचा सर्वोच्च हेतू असलेले खरेदीदार असेल. आमच्या संशोधनात, आम्ही ओळखले की स्त्रिया 5 प्रमुख निर्णय प्रभावकांसह कपडे खरेदी करतात:

  • कपडे शैली
  • कपड्यांचे रंग
  • कपड्यांचे भाव
  • मोफत शिपिंग
  • त्रास-मुक्त परतावा

शीर्षके आणि मेटा वर्णन गंभीर आहेत तुमची सामग्री अनुक्रमित आणि योग्यरित्या प्रदर्शित करण्यासाठी. त्यामुळे, अर्थातच, आम्हाला शीर्षक टॅग आणि मेटा वर्णन हवे आहेत ज्यात ते मुख्य घटक आहेत!

  • अगोदर निर्देश केलेल्या बाबीसंबंधी बोलताना शीर्षक टॅग प्रासंगिकतेच्या शोधांसाठी तुमची पृष्ठे योग्यरित्या अनुक्रमित केली गेली आहेत याची खात्री करण्यासाठी तुमचे पृष्ठ शीर्षलेख महत्त्वपूर्ण आहे.
  • अगोदर निर्देश केलेल्या बाबीसंबंधी बोलताना मेटा वर्णन शोध इंजिन परिणाम पृष्ठांमध्ये (SERPs) प्रदर्शित केले जाते जे अतिरिक्त माहिती प्रदान करते जी शोध वापरकर्त्यास क्लिक करण्यास प्रवृत्त करते.

आव्हान हे आहे की Shopify अनेकदा वेगवेगळ्या पृष्ठ टेम्पलेट्सवर शीर्षके आणि मेटा वर्णन सामायिक करते – मुख्यपृष्ठ, संग्रह, उत्पादने, इ. त्यामुळे, शीर्षके आणि मेटा वर्णने योग्यरित्या डायनॅमिकपणे पॉप्युलेट करण्यासाठी मला काही तर्क लिहावे लागले.

तुमचे Shopify पृष्ठ शीर्षक ऑप्टिमाइझ करा

Shopify ची थीम भाषा तरल आहे आणि ती खूप चांगली आहे. मी सिंटॅक्सच्या सर्व तपशीलांमध्ये प्रवेश करणार नाही, परंतु तुम्ही डायनॅमिकपणे पृष्ठ शीर्षक अगदी सहज तयार करू शकता. तुम्हाला येथे एक गोष्ट लक्षात ठेवावी लागेल ती म्हणजे उत्पादनांमध्ये रूपे असतात … त्यामुळे तुमच्या पृष्ठाच्या शीर्षकामध्ये रूपे समाविष्ट करणे म्हणजे तुम्हाला पर्याय शोधून काढावे लागतील आणि जेव्हा टेम्पलेट एक असेल तेव्हा डायनॅमिकली स्ट्रिंग तयार करावी लागेल. उत्पादन टेम्पलेट.

येथे a साठी शीर्षकाचे उदाहरण आहे प्लेड स्वेटर ड्रेस.

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

आणि तो परिणाम देणारा कोड येथे आहे:

{%- capture seo_title -%}
  {{- page_title -}}
    {% assign my_separator = " » " %}
    {%- if current_tags -%}{%- assign meta_tags = current_tags | join: ', ' -%}{{ my_separator }}{{ 'general.meta.tags' | t: tags: meta_tags -}}{%- endif -%}
    {%- if current_page != 1 -%}{{ my_separator }}{{ 'general.meta.page' | t: page: current_page }}{%- endif -%}
    {%- if template == "product" -%}{{ " on sale today for " }}{{ 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 -%}{{ my_separator }}{{ shop.name }}
{%- endcapture -%}
  
<title>{{ seo_title | strip_newlines }}</title>

कोड खालीलप्रमाणे खंडित होतो:

  • पृष्ठ शीर्षक - प्रथम वास्तविक पृष्ठ शीर्षक समाविष्ट करा... टेम्पलेट काहीही असो.
  • टॅग्ज - पृष्ठाशी संबंधित टॅगमध्ये सामील होऊन टॅग समाविष्ट करा.
  • उत्पादन रंग - रंग पर्यायांमधून लूप करा आणि स्वल्पविरामाने विभक्त स्ट्रिंग तयार करा.
  • मेटाफिल्ड्स - या Shopify उदाहरणामध्ये मेटाफिल्ड म्हणून ड्रेसची लांबी आहे जी आम्ही समाविष्ट करू इच्छितो.
  • किंमत – पहिल्या प्रकाराची किंमत समाविष्ट करा.
  • दुकान नाव - शीर्षकाच्या शेवटी दुकानाचे नाव जोडा.
  • विभाजक - विभाजकाची पुनरावृत्ती करण्याऐवजी, आम्ही ते फक्त एक स्ट्रिंग असाइनमेंट बनवतो आणि ते पुन्हा करतो. अशा प्रकारे, आपण भविष्यात ते चिन्ह बदलायचे ठरवले तर ते फक्त एकाच ठिकाणी आहे.

तुमचे Shopify पृष्ठ मेटा वर्णन ऑप्टिमाइझ करा

आम्ही साइट क्रॉल केल्यावर, आमच्या लक्षात आले की कॉल केलेले कोणतेही थीम टेम्पलेट पृष्ठ मुख्यपृष्ठ SEO सेटिंग्जची पुनरावृत्ती करत आहे. पृष्ठ हे मुख्यपृष्ठ, संग्रह पृष्ठ किंवा वास्तविक उत्पादन पृष्ठ आहे की नाही यावर अवलंबून आम्हाला भिन्न मेटा वर्णन जोडायचे आहे.

तुमच्या टेम्पलेटचे नाव काय आहे याची तुम्हाला खात्री नसल्यास, फक्त तुमच्या मध्ये एक HTML नोट जोडा theme.liquid फाइल आणि ते ओळखण्यासाठी तुम्ही पृष्ठाचा स्रोत पाहू शकता.

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

यामुळे आम्हाला साइटचे मेटा वर्णन वापरलेले सर्व टेम्पलेट्स ओळखण्याची परवानगी दिली जेणेकरून आम्ही टेम्पलेटवर आधारित मेटा वर्णन सुधारू शकू.

वरील उत्पादन पृष्ठावर आम्हाला हवे असलेले मेटा वर्णन येथे आहे:

<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 hassle-free returns at Closet52.">

हा कोड आहे:

{%- 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 == 'product' -%}
        {{ " On sale today for " }}{{ product.variants[0].price | money }}!
      {%- endif -%}
   {%- endif -%}
  {%- endif -%}
  {{ " Always FREE 2-day shipping and hassle-free returns at " }}{{ shop.name | strip }}.
{%- endcapture -%}
  
<meta name="description" content="{{ seo_metadesc | strip_newlines }}">

परिणाम म्हणजे कोणत्याही प्रकारच्या टेम्पलेट किंवा तपशीलवार उत्पादन पृष्ठासाठी शीर्षक आणि मेटा वर्णनांचा डायनॅमिक, सर्वसमावेशक संच. पुढे जाताना, मी बहुधा केस स्टेटमेंट्स वापरून कोड रिफॅक्टर करेन आणि ते थोडे चांगले व्यवस्थित करेन. परंतु आत्तासाठी, ते शोध इंजिन परिणाम पृष्ठांमध्ये खूप छान उपस्थिती निर्माण करत आहे.

तसे, जर तुम्हाला मोठी सवलत हवी असेल... आम्हाला आवडेल की तुम्ही कूपन 30% सूट देऊन साइटची चाचणी घ्या, कोड वापरा HIGHBRIDGE चेक आउट करताना.

आत्ताच कपडे खरेदी करा

प्रकटीकरण: मी एक संलग्न आहे Shopify आणि थीम आणि मी या लेखात त्या लिंक्स वापरत आहे. Closet52 हा माझ्या फर्मचा क्लायंट आहे, Highbridge. Shopify वापरून तुमची ईकॉमर्स उपस्थिती विकसित करण्यात तुम्हाला मदत हवी असल्यास, कृपया आमच्याशी संपर्क.