How to Edit Header in Shopify Store
While running an online store on the eCommerce platform, you may have to undertake multiple tasks. One of them is to figure out How to Edit Header in your Shopify Store?.
For some online business administrators, the task of editing header may seem complicated. But with our step-by-step guide, you will come up with a simple answer. You will have a better grasp of the header issues, and learn how to edit header in Shopify.
Please do not go anywhere since we will go through the details right now. Let’s begin!
Exclusive Offer: Get Shopify 33 days for just $1 + The Online Store Starter Kit
Start your 3-day free trial, and enjoy your first month of Shopify for 1$ plus the premium package designed especially for new Shopify merchants!
Related posts:
- How to Change Shopify store URL
- How to add Sidebar in Shopify
- How to Add Terms of Service to your Shopify Store
Header issues
The size of the header
If you are a newbie to the Shopify platform, then you may find editing the size of the header tricky. It may be too big or too small for you and you may need to change it until you are fully satisfied.
The color of the header
Like the size, the color is also a vital element of the header if you want to make it unique and stand out from the crowd. If the color is boring or not appealing to you, then you might need to adjust it.
The unwanted title
The unwanted title may occur when you accidentally put the wrong title or when you realize you need to replace the current title with a better and more interesting one.
The unexpected line
The picture is the same for an unexpected line. You may not want it anymore and you need to adjust it in your Shopify store.
How to edit header in Shopify?
Edit the size of the header
Step 1: Go to Customize
After you log in to your Shopify admin, you can go to the Online Store
section, then click Customize
.
Step 2: Tap on Header
On the menu to the left, tap on Header
.
If you have a logo uploaded, you can customize your logo size, and it will automatically adjust the header’s height.
If you do not have a logo, or if you only need to adjust the height, it will be necessary to edit your theme code.
Before modifying any code, duplicating your theme is a crucial step. By doing it, you will not affect your customers if you detect any unintended results!
Step 3: Go to Themes
In your Shopify admin, head to the Online Store
section, then click Themes
.
Step 4: Click Duplicate
Tap on Action
, then click Duplicate
to duplicate the theme you want to.
Once you have duplicated your theme, you can follow the simple steps below:
Step 5: Click Edit Code
In your Shopify admin, go to the Online Store
section, click Actions
, then tap on Edit Code
.
Step 6: Choose theme.scss.liquid
Next, on the left, you will notice a list of folders. Inside your Assets
folder, choose theme.scss.liquid
.
Step 7: Add height: [your height size here];
In that file, look for ‘site-header {‘,
and add height: [your height size here];
below it.
Your code should appear like this:
Step 8: Tap on Save
Change the color of the header
In the same file and section as preceding, you may need to change your background color. You can simply substitute background-color: $color-body;
with background-color: #000;
.
#000
is a hex color value for black. Should you want to edit this color in the future, you can replace #000
with the color you want.
Your final .site-header
code should be like this:
Change header title
Step 1: Go to General
At the top left of your store, you can notice your store name. If you want to change it, you can go to the Settings
section, then click General
and change your store name.
Step 2: Replace Header section with a logo
From the theme section, you can tap on the Header
section in your Customize Theme Editor and substitute that with a logo.
If you want to change your store name in the meta description of the store, you can head to the Online Store
section, then click Preferences
.
Free 1:1 Shopify consultation & 30-day all-app trial FREE
- Shopify Plus Strategy and Consultation
- Personalized E-commerce Solutions
- Conversion Rate Boosting Techniques
- Inventory Management Hacks
Final thoughts
To sum up, the importance of realizing How to Edit Header in your Shopify Store is crucial in improving the appearance of your Shopify shop. By figuring out how to do it, you can boost the performance of your business and gradually bring uniqueness to your brand.
Hopefully, by reading our step-by-step guide will illustrated pictures, you can do edit the header effortlessly and manage your online business on the Shopify platform efficiently and effectively.
For any online business of all kinds and sizes, a strong Terms of Conditions agreement is as vital as selecting your site theme. You can check out our post How to add Terms of Service to your Shopify store for more information.
If you have any questions, comments, or concerns; do not hesitate to leave a comment or contact us directly. We are always ready to help you out in case you need anything.