Post by ahpongccx » Thu Aug 04, 2016 11:31 am

I'm using opencart version 2.2.0.0 , wonder how to add or edit code for :
1) Fix header when scroll down ,
2) Promo wrapper on top page,

such as following website >>> https://www.cottonink.co.id/shop/catalog/accessories/ , really need the support for this 2 edit , anyone can assist on this matter , much appreciate.

Newbie

Posts

Joined
Fri Jul 22, 2016 3:10 pm

Post by knowband.plugins » Thu Aug 04, 2016 3:43 pm

Don't you need this fixed header and promo wrapper?

What change do you want to make there?

Regards,
Knowband Plugins Team

Opencart Plugins: Knowband Store
Email: support@knowband.com


User avatar

Posts

Joined
Thu Aug 04, 2016 2:56 pm


Post by straightlight » Thu Aug 04, 2016 11:37 pm

This topic will be moved to the Template Support section of the forum.

Tired of paying for service fees to export your database from other databases over Opencart?

Try those extensions for FREE: http://www.opencart.com/index.php?route ... aightlight

Regards,
Straightlight


Newbie

Posts

Joined
Mon Nov 14, 2011 11:38 pm
Location - Canada, ON

Post by sarthakinfotech » Fri Aug 05, 2016 12:09 pm

hi
i found the solution for this requirement.

you may use jquery plungins for this

like you may find many solutions from here
http://www.jqueryrain.com/demo/jquery-fixed-header/

i have chosen this one
https://github.com/bigspotteddog/ScrollToFixed

steps to follow is as below;

1.download files from https://github.com/bigspotteddog/ScrollToFixed link
2.place jquery-scrolltofixed-min.js at
catalog\view\javascript\jquery
3.open catalog\view\theme\default\template\common\header.tpl

goto

Code: Select all

<script src="catalog/view/javascript/jquery/jquery-2.1.1.min.js" type="text/javascript"></script>
and add below code

Code: Select all

<script src="catalog/view/javascript/jquery/jquery-scrolltofixed-min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
  $('#mydiv').scrollToFixed();
});
</script>
4.now goto

Code: Select all

<nav id="top"> 
and above this add below code

Code: Select all

<div id="mydiv" style="z-index:1;background-color:white;">
now goto
end of file and add below code

Code: Select all

</div>
now you may test the code .

it will work as you want.

good day.
Last edited by straightlight on Fri Aug 05, 2016 7:05 pm, edited 1 time in total.
Reason: Added code tags.

Good Day,
Hiren
http://sarthakinfotech.com
opencart blogs,theme, extension, custom development.


User avatar

Posts

Joined
Tue Aug 05, 2014 1:12 am
Location - india

Post by ahpongccx » Fri Aug 05, 2016 2:47 pm

@sarthakinfotech

This is awesome and it's works , thank you so much dule, much appreciate !!!!!! :D

Newbie

Posts

Joined
Fri Jul 22, 2016 3:10 pm

Post by sarthakinfotech » Fri Aug 05, 2016 8:25 pm

hi
its really great.

thanks for the appreciation.

good day.

Good Day,
Hiren
http://sarthakinfotech.com
opencart blogs,theme, extension, custom development.


User avatar

Posts

Joined
Tue Aug 05, 2014 1:12 am
Location - india

Post by avramalex111 » Mon Aug 08, 2016 12:02 am

sarthakinfotech wrote:hi
i found the solution for this requirement.

you may use jquery plungins for this

like you may find many solutions from here
http://www.jqueryrain.com/demo/jquery-fixed-header/

i have chosen this one
https://github.com/bigspotteddog/ScrollToFixed

steps to follow is as below;

1.download files from https://github.com/bigspotteddog/ScrollToFixed link
2.place jquery-scrolltofixed-min.js at
catalog\view\javascript\jquery
3.open catalog\view\theme\default\template\common\header.tpl

goto

Code: Select all

<script src="catalog/view/javascript/jquery/jquery-2.1.1.min.js" type="text/javascript"></script>
and add below code

Code: Select all

<script src="catalog/view/javascript/jquery/jquery-scrolltofixed-min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
  $('#mydiv').scrollToFixed();
});
</script>
4.now goto

Code: Select all

<nav id="top"> 
and above this add below code

Code: Select all

<div id="mydiv" style="z-index:1;background-color:white;">
now goto
end of file and add below code

Code: Select all

</div>
now you may test the code .

it will work as you want.

good day.
Thank you so much!!!

1st Site: Web Design
2nd Site: Servicii Web Design
3rd Site: Gazduire Web
4th Site: Librarie Online
5th Site: Creare Magazin Online


Newbie

Posts

Joined
Tue Jun 23, 2015 12:12 am
Location - Bucuresti

Post by sarthakinfotech » Wed Sep 07, 2016 1:23 am

hi
anybody wish to get such functionality may refer http://forum.opencart.com/viewtopic.php?f=124&t=167034

Good Day,
Hiren
http://sarthakinfotech.com
opencart blogs,theme, extension, custom development.


User avatar

Posts

Joined
Tue Aug 05, 2014 1:12 am
Location - india

Post by klyn05 » Tue Nov 08, 2016 12:46 pm

This code works perfectly. Thank you so much!!!!

Newbie

Posts

Joined
Sat Jan 03, 2015 2:27 am

Post by robihdr@gmail.com » Fri Dec 02, 2016 10:06 pm

Thanks well down
my site: http://grameenshoppers.com/
sarthakinfotech wrote:hi
i found the solution for this requirement.

you may use jquery plungins for this

like you may find many solutions from here
http://www.jqueryrain.com/demo/jquery-fixed-header/

i have chosen this one
https://github.com/bigspotteddog/ScrollToFixed

steps to follow is as below;

1.download files from https://github.com/bigspotteddog/ScrollToFixed link
2.place jquery-scrolltofixed-min.js at
catalog\view\javascript\jquery
3.open catalog\view\theme\default\template\common\header.tpl

goto

Code: Select all

<script src="catalog/view/javascript/jquery/jquery-2.1.1.min.js" type="text/javascript"></script>
and add below code

Code: Select all

<script src="catalog/view/javascript/jquery/jquery-scrolltofixed-min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
  $('#mydiv').scrollToFixed();
});
</script>
4.now goto

Code: Select all

<nav id="top"> 
and above this add below code

Code: Select all

<div id="mydiv" style="z-index:1;background-color:white;">
now goto
end of file and add below code

Code: Select all

</div>
now you may test the code .

it will work as you want.

good day.


Posts

Joined
Fri Dec 02, 2016 10:03 pm

Post by elsker-min-mathilde » Sun Jan 22, 2017 1:10 am

Thank you mate! Works like a charm :D

Rabatkoder - Dametøj



Posts

Joined
Sat Jan 21, 2017 11:26 pm
Location - Denmark

Post by Gr3nT » Tue May 16, 2017 5:36 am

Best Fix. Thanks :)

Webáruház készítés | GrenT Média.hu


Newbie

Posts

Joined
Thu May 17, 2012 7:46 pm

Post by viethemes » Fri May 19, 2017 12:00 pm

I have made a OCMOD extension according to the sarthakinfotech's sarthakinfotech. You can download it here https://www.dropbox.com/s/4cyc4a97ox6zn ... d.xml?dl=0. This will prevent from loosing the change when you update OpenCart :)

http://www.viethemes.com - OpenCart turtorials, news, tips and stricks, extension

Our extensions:
Visual Theme Editor - Powerful tool for customizing style of any theme visually
Live Theme Editor - Customize layout, colors, backgrounds, fonts of the default theme
Theme Animation - Animation Editor for any theme

Extra Positions PRO, Custom JavaScript, Custom CSS and others


User avatar
Newbie

Posts

Joined
Thu Jan 08, 2015 12:17 pm

Who is online

Users browsing this forum: No registered users and 10 guests