Website Bar/image

New Member
2 0 0

Hi guys, I always wanted to do this bar/image thing as circled in the two examples below, I'm using the debut theme and Can anyone advise how I can go about doing this? Thanks a lot


WhatsApp Image 2019-07-30 at 10.33.03 PM.jpegWhatsApp Image 2019-07-30 at 10.33.21 PM.jpeg

835 95 178

You just need to make a container with 3 items, set it's display to flex, and text align to center with various other styles:


.my-container {
    display: flex;
    justify-content: center;
    background-color: #333;
    color: white;
    padding: 10px 0px;
.my-item {
    width: 33.33%;
    text-align: center;
<div class="my-container">
    <div class="my-item">Free Shipping</div>
    <div class="my-item">Something Else</div>
    <div class="my-item">Another Thing</div>

You'd have to use FontAwesome's library for icons, or design them yourself with a graphic editing program. There's a nice browser one called Photopea, that's basically photoshop in your browser:


This is what the above code looks like without icons:



If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D