Crave Theme - How To Add Sidebar to Blog???

CelticSourdough
Tourist
4 0 0

So I've searched both here and Google but can't seem to find an answer. How do I add a sidebar to the blog in the Crave theme? While we're at it, I'd like to add a search bar too - preferably one that only searches blog posts, not the entire site. Thanks!

Replies 5 (5)

Liqiud_xPert_SJ
Shopify Partner
730 93 115

@CelticSourdoughwelcome to the Shopify Community,

 

please refer to the sidebar code below you can just create a snippet file called "blog-sidebar" and put this code into that and render that snippet into your main blog template like render "blog-sidebar" and thats it.

 

<div class="sidebar_blog_search">
	<div class="sidebar_blog_search_box">
        <form method="get" action="/search">
          <input placeholder="SEARCH BLOG" class="searchBox field" type="text" name="q"{% if search.performed %} value="{{ search.terms | escape | downcase }}"{% endif %} /> 
          <input type="hidden" name="type" value="article" />
          <input class="searchSubmit" type="submit" value="Search" class="submit" />
        </form>
    </div>
</div>
<div class="sidebar_item_box most_popular_section">
	<h3 class="article--title font--section-heading">most popular</h3>
    <div class="most_popular_section_inner">
    {% assign counter = 0 %}
    {% for article in blogs.indique-blog.articles %}
      {% if counter == 3 %}
        {% break %}
      {% endif %}
    {% if article.tags.size > 0 %}
    {% for tag in article.tags %}
    {% if tag contains 'most popular' %}
        {% assign counter = counter | plus: 1 %}
        <div class="item_box_inner">
            <div class="item_box_left">
                {% if article.image %}
                    <img src="{{ article | img_url: 'large' }}" title="">
                {% endif %}
            </div>
            <div class="item_box_right">
                {% if article.tags.size > 0 %}
                    {% for tag in article.tags %}
                      <div class="item_tag_title"><a href="{{ blog.url }}/tagged/{{ tag | handle }}">{{ tag }}</a></div>
                      {% break %}
                    {% endfor %}
                {% endif %}
                <div class="item_title"><a href="{{ article.url }}">{{ article.title }}</a></div>
                <div class="item_readmore"><a href="{{ article.url }}" title="read more">read more</a></div>
            </div>
        </div>
    {% endif %}	    
    {% endfor %}
    {% endif %}	
    {% endfor %}
    </div>
</div>

 

thaks

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
CelticSourdough
Tourist
4 0 0

Thank you!  That'll put a search bar in, but it's at the bottom of the page, not the side. Also, the sidebar is my main interest, but the search bar is 99% as important, as I plan on having many, many recipes in the blog. I'd like to be able to search using tags and/or categories too.  Here's the URL to take a look: https://celticsourdough.com/blogs/recipes

 

Liqiud_xPert_SJ
Shopify Partner
730 93 115

@CelticSourdough 

 

I guess you need to hire an expert who can do this for you and place and change the code accordingly. the code i provided was 100% in working state but upon your requirements it can be change and updated.

 

thanks

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
CelticSourdough
Tourist
4 0 0

Okay, thank you.  You've been extremely helpful in setting me in the right direction. I'll have to look up a few CSS sites to learn how to style it a bit more to my requirements.

Liqiud_xPert_SJ
Shopify Partner
730 93 115

GREAT

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂