http://www.digitaldrivethru.com/burchgottfried
I'm a newbie to Open Cart so please have patience...
Please note: I do not have a live site where I'm actually selling products. I'm working on a "fake" site for my portfolio and work is still in progress so disregard formatting, etc. for now.
I've researched several ways to customize Open Cart but there is so much information out there my head is spinning.
Just changing the background color and font size isn't enough for me, yet I don't know php so don't know how advanced I'm capable of going.
What I ended up with is experimenting around with the Theme Editor > common > home.twig, code shown below:
Questions:
- Is this how you edit this template - just stick your own html into the code? Because I'm not familiar with php, I'm not sure where to place it. Have I done it correctly or how should I approach this? In browser it looks fine. It is placed directly underneath the slideshow.
- I have located the stylesheet in catalog > view > theme >stylesheet and have been successful at making the changes I want except that every now and then I have to clear my browser cache and the theme cache in order for changes to show.
- When I cleared the theme cache all changes to home.twig that I made were gone and had to start over. Is there a way to prevent this?
- I was looking at a tutorial that was talking about .tpl pages such as home.tpl but I only see .twig files? Are .tpl files something from the past?
{{ header }}
<div id="common-home" class="container">
<div class="row">{{ column_left }}
{% if column_left and column_right %}
{% set class = 'col-sm-6' %}
{% elseif column_left or column_right %}
{% set class = 'col-sm-9' %}
{% else %}
{% set class = 'col-sm-12' %}
{% endif %}
<div id="content" class="{{ class }}">
{{ content_top }}
THIS IS THE HTML THAT I'VE INTRODUCED UNDER CONTENT_TOP
Code: Select all
<h4 class="homeIntro">Burch & Gottfried is the UK's go-to source for the hottest trends and styles in accessories. We are now expanding into the United States and continuing our legendary heritage.</h4>
<h3 class="homeQuickShop">Quick Shop These Popular Categories!<br></h3>
<div class="mainCatImage">
<a href="http://www.digitaldrivethru.com/burchgottfried/index.php?route=product/category&path=68"" target="_blank" >
<img src="http://www.digitaldrivethru.com/burchgottfried/image/catalog/mainSpecsThumb.jpg"></a>
<figcaption>Sunglasses</figcaption>
<a href="http://http://www.digitaldrivethru.com/burchgottfried/index.php?route=product/category&path=64" target="_blank" ><img src="http://www.digitaldrivethru.com/burchgottfried/image/catalog/mainBagThumb.jpg" ></a>
<figcaption>Handbags</figcaption>
<a href="http://http://www.digitaldrivethru.com/burchgottfried/index.php?route=product/category&path=65" target="_blank" ><img src="http://www.digitaldrivethru.com/burchgottfried/image/catalog/mainHatsThumb.jpg" ></a>
<figcaption>Hats</figcaption>
<a href="http://www.digitaldrivethru.com/burchgottfried/index.php?route=product/category&path=59" target="_blank"><img src="http://www.digitaldrivethru.com/burchgottfried/image/catalog/mainAccessThumb.jpg" ></a><figcaption>Accessories</figcaption>
</div>
{{ content_bottom }}
</div>
{{ column_right }}
</div>
</div>
{{ footer }}