Post by dani888 » Thu Oct 18, 2018 1:02 am

Hello
After adding this code that works well for the add to cart button,
A part of the theme has also been modified in product page.
Opencart 3.0.2.0
My theme oc-light http://www.spearthemes.com/oc-light/
1. Replace you css code with :
.btn-default {
transition: 0.4s;
color: #fff;
background-color: #303030;
text-transform: uppercase;
position:relative;
padding-right:52px;
width:100%
}
.fa-shopping-cart {
position:absolute;
right:0px;
top:0px;
padding:9px 12px 7px 10px;
background:red;
height:100%;
font-size:130%;
}
.product-thumb {
padding-bottom: 0px;
}

2. Navigate to catalog/view/theme/oc-light/template/common/header.twig
Search for <i class="fa fa-shopping-cart"> and replace it with <i class="fa fa-shopping-bag">
A part of the theme has also been modified in product page.
There is still something to go back to the original theme, but the modification to the add to cart button remains.
Thank you

Attachments

My theme.jpg

My theme.jpg (84.43 KiB) Viewed 743 times

Button Home page works.jpg

Button Home page works.jpg (87.05 KiB) Viewed 743 times

original theme.jpg

original theme.jpg (54.62 KiB) Viewed 743 times


Active Member

Posts

Joined
Wed Feb 14, 2018 1:47 am

Post by louposk » Thu Oct 18, 2018 3:27 pm

Here you say that "replace it with <i class="fa fa-shopping-bag">" but in your css tou posted this class is not contained.
So it seems that fa-shopping-bag needs to be added in your css file.

Newbie

Posts

Joined
Tue Oct 16, 2018 2:12 am

Post by dani888 » Thu Oct 18, 2018 9:26 pm

Hello
Does anyone know how to add to the css fa-shopping-bag code that needs to be added in your css file
I've never done it before
Thank you

Active Member

Posts

Joined
Wed Feb 14, 2018 1:47 am

Post by cyclops12 » Sat Oct 20, 2018 4:54 am

shopping bag is already defined, just change the edit in header.twig

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by dani888 » Sun Oct 21, 2018 2:16 am

Hello
In the header we did not find anything under the name of shopping bag
I want to keep shopping bag
Original site
http://prntscr.com/l8dq84

My site modified after I've added the code above
http://prntscr.com/l8dr8z
But some of the theme in the product has changed
The front part of the theme works
I put some of the code header .twig
{% else %}
<li><a href="{{ register }}">{{ text_register }}</a></li>
<li><a href="{{ login }}">{{ text_login }}</a></li>
{% endif %}
</ul>
</li>
<li><a href="{{ shopping_cart }}" title="{{ text_shopping_cart }}"><i class="fa fa-shopping-cart"></i> <span class="hidden-xs hidden-sm hidden-md">{{ text_shopping_cart }}</span></a></li>
<li><a href="{{ checkout }}" title="{{ text_checkout }}"><i class="fa fa-share"></i> <span class="hidden-xs hidden-sm hidden-md">{{ text_checkout }}</span></a></li>
</ul>
</div>
</div>
</nav>
<header>
<div class="container">
<div class="row">
<div class="col-sm-3">
<div id="logo">{% if logo %}<a href="{{ home }}"><img src="{{ logo }}" title="{{ name }}" alt="{{ name }}" class="img-responsive logofix" /></a>{% else %}
<h1><a href="{{ home }}">{{ name }}</a></h1>
{% endif %}</div>
</div>
<div class="col-sm-6">{{ search }}</div>
<div class="col-sm-3">{{ cart }}</div>
</div>
</div>
</header>
{{ menu }}
Thank you

Active Member

Posts

Joined
Wed Feb 14, 2018 1:47 am
Who is online

Users browsing this forum: No registered users and 309 guests