Custom sidebar bookmarker in dawn theme

Retired Boards Appdev Partners Discussion
1

Hello,
I am a developer but I am new to the Shopify platform. I’m trying to add a custom section to enable my client to be able to add a bookmark sidebar to any page they wish.

I’ve successfully added sections before, but since I want this sidebar to act as a sticky bookmark on the side of the page, I’m having difficulty knowing how/where to render this information. For example, when I go to the customizer, I am able to see the “sidebar” rendered in the “Add Section” but when I add it to my page, none of the text I input will render.

I’m using the dawn theme, but wonder if this is the best option. Any advice would be greatly appreciated. Thank you!!

Here’s my sidebar-bookmarker.liquid file:


  

     
    
    {% if section.blocks.size > 0 %}
      
        

          {% for block in section.blocks %}
            {% if block.settings.bookmark_text != blank and block.settings.bookmark_url != blank %}
              - {{ block.settings.bookmark_text }}
            {% endif %}
          {% endfor %}
        

      
    {% endif %}
  

{% schema %}
{
  "name": "Sidebar Bookmarker",
  "settings": [
    {
      "type": "range",
      "id": "padding_top",
      "min": 0,
      "max": 100,
      "unit": "px",
      "label": "Padding Top",
      "default": 36
    },
    {
      "type": "range",
      "id": "padding_bottom",
      "min": 0,
      "max": 100,
      "step": 1,
      "unit": "px",
      "label": "Padding bottom",
      "default": 36
    },
    {
      "type": "range",
      "id": "height",
      "min": 0,
      "max": 100,
      "step": 1,
      "unit": "px",
      "label": "Height of the sidebar",
      "default": 5
    },
    {
      "type": "color",
      "id": "color",
      "default": "#000",
      "label": "Sidebar color"
    },
    {
      "type": "checkbox",
      "id": "full_width",
      "default": false,
      "label": "Sidebar full-width"
    },
    {
      "type": "text",
      "label": "Bookmark 1 Text",
      "id": "bookmark_1_text"
    },
    {
      "type": "url",
      "label": "Bookmark 1 URL",
      "id": "bookmark_1_url"
    },
    {
      "type": "text",
      "label": "Bookmark 2 Text",
      "id": "bookmark_2_text"
    },
    {
      "type": "url",
      "label": "Bookmark 2 URL",
      "id": "bookmark_2_url"
    },
    {
      "type": "text",
      "label": "Bookmark 3 Text",
      "id": "bookmark_3_text"
    },
    {
      "type": "url",
      "label": "Bookmark 3 URL",
      "id": "bookmark_3_url"
    }
    // Add more bookmarks if needed
  ],
  "presets": [
    {
      "name": "Sidebar"
    }
  ]
}
{% endschema %}
1 Like