Hello,
Dawn theme gives an option to have social media icons added to the Announcement bar. Thing is that you have no option where exactly to place them… and by default they appear on the left. How can I move them to the right side instead (as per the snapshot below)?
Hi @ys008 ,
Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.
Hello! Here we go https://damnpineleathergoods.com/
Hi @BSS-Commerce did you have the chance to look into this?
Note: Code Pasted below reply for copy purposes.
@ys008 just starting to use Shopify, so I’m not an expert by any means, but know how to code. I was able to get this to work for me on Dawn, hope this helps if you did not get an answer already.
I have been getting much help from this community I decided to join and pay it forward.
There are only a few steps:
SAVE YOUR THEME FIRST!!! Make changes in a copy and test.
File to Update: announcement-bar.liquid
Step 1: Remove Social Media Icons from Left Side: Find the following code in the announcement-bar.liquid and either Cut it or comment it out.
Note: I personally comment code out and state when I did it instead of deleting. If I ever want to move something back I don’t want to figure out where it came from.
Step2: Paste Copied or Cut Code to desired location.
So this step is useful to others who may view this post. I will describe the options of where you can paste this code and you will have to determine ‘EXACTLY’ where you need to put it.
This announcement-bar.liquid is broken up into setting the rules for the structure of the announcement bar, displaying the announcement based on those rules, then finally the structure of the front end. The rules are based on how you have your store setup. So depending on your setup you may have to move the copied code to 1 of 3 locations.
Default Setup for Dawn is as follows:
social icons → announcement bar → country → language
For my example of where I moved the social icons I have.
announcement bar → empty → empty → social icons
This works for me because I do not have languages or countries. Due to the fact that the announcment_bar is currently always set to the middle, if I did have either it may not fit to the right of the announcement_bar appropriately and I would have to make further adjustments to the language and country code, and alter the location within this script to move them to the left of the announcement.
Ultimately when I create countries and languages, I will alter this form to allow me to do it dynamically where I can select how I want the structure to display and select from the front end of the Dawn Theme. I will create a video and paste a link at that point.
Location to Paste Copied Code:
The lines of code break up the columns of the announcement bar, and you can alter where you paste this code to move between the country and language. If you want to move the country and language to the left that will require a little more work of understanding this structure and modifying this logic.
Hope this helps and let me know if you have any issues.
{%- if section.settings.show_social and social_icons -%}
{%- render ‘social-icons’ -%}
{%- endif -%}
Thanks a lot for the detailed instructions, let me give this a try!
