[Prestashop theme] How to change Color of Address Bar in Mobile Browser for a Prestashop theme?
Address Bar of browser is a placement where you enter a URL to open a website. Sometime you want change color of address bar to match your brand’s color like this picture
So How to change Color of Address Bar in Mobile Browser for a Prestashop theme?
Step 1: Go to header section of your Prestashop theme.
- In Prestashop 1.6, open a file PRESTASHOP_ROOT\themes\YOUR_THEME\header.tpl
Add this line code (change #673ab7 to your color)
<meta name=”theme-color” content=”#673ab7″>
After this line
<meta charset=”utf-8″ />
- In Prestashop 1.7, open file PRESTASHOP_ROOT\themes\YOUR_THEME\templates\_partials\head.tpl
Add this code
<meta name=”theme-color” content=”#673ab7″>
After this line
<meta charset=”utf-8″>
Step 2: Download manifest.json and change it to your information, then upload it into your PRESTASHOP_ROOT directory.
manifest.json
Example: https://www.purplle.com/manifest.json
Read more all params of manifest.json file from Google Dev: https://developer.mozilla.org/en-US/docs/Web/Manifest
Step 3: Everything is done, you can open your Prestashop website in Chrome browser of an Android device to view result.
The layout like this
Related Articles
Categories
- E-commerce (30)
- B2B E-commerce (3)
- E-Commerce Trends (2)
- Ecommerce Tips and Advice (8)
- Merchants (3)
- Social, SEO & Marketing (8)
- Success Stories (2)
- Mobile Native Web App (1)
- Prestashop (97)
- Admin setup & manage Store (18)
- B2B commerce (7)
- Customize your online store (29)
- Developement (10)
- Dropshipping (1)
- Fix Errors (1)
- Improve Conversion rate, Sales (9)
- Improve customer service (13)
- Marketing & Promotions (7)
- Performance & Security (6)
- Prestashop modules (15)
- Prestashop Templates (7)
- Promote Products (5)
- SEO & Increase Traffic (12)
- Wordpress (1)
- Wordpress Mobile (1)
Popular Posts
-
Top 11 Best Prestashop Modules to create a unique menu
When operating a website for your store, sometimes you pay too much attention to content. Of course, content plays a…
-
[Prestashop help] How to remove or translate, change “Ecommerce software by PrestaShop™” in footer?
In some Prestashop themes or in default Prestashop theme, Footer block always display a Text as “© 2019 – Ecommerce…
2 Comments
Hello, i added the line to the header and the manifest to the root of prestashop but doesnt works… any suggest?
for your issue:
Please open a ticket https://taydoapp.com/helpdesk
and give us your admin + ftp account
we can check this issue for help you.
Do not worry, if you need any our support. We are always ready to free work.
Thanks.