Dover Fine Responsive Template

[picaflor-azul]

Thanks.. I found it.

Had a <b> without a </b> in my modified
blank_sidebox_defines.php file.

in case anyone wants it.. I have added Login-My Account-Contact Us links in the side menu under the Social Media icons...
Attachment 15299

by changing the file
/includes/languages/english/extra_definitions/dover_fine/blank_sidebox_defines.php

file to be...

define('BOX_HEADING_BLANK_SIDEBOX', 'Blank Sidebox Header');
if ($_SESSION['customer_id']) {
  define('TEXT_BLANK_SIDEBOX', 
       '<a href="https://www.facebook.com/pages/XXXXXXXXX" target="_blank"><i class="fa fa-facebook"></i></a>
        <a href="https://twitter.com/XXXXXXXX" target="_blank"><i class="fa fa-twitter"></i></a>
        <a href="https://www.pinterest.com/XXXXXXXXXX" target="_blank"><i class="fa fa-pinterest"></i></a>
        <a href="https://www.youtube.com/user/XXXXXXXXXX" target="_blank"><i class="fa fa-youtube"></i></a>
        <br><br>
        <b><a href="' . zen_href_link(FILENAME_LOGOFF, '', 'SSL') . '">  ' . HEADER_TITLE_LOGOFF . '  </a>
        - <a href="' . zen_href_link(FILENAME_ACCOUNT, '', 'SSL') . '">' . HEADER_TITLE_MY_ACCOUNT . '  </a>
        - <a href="' . zen_href_link(FILENAME_CONTACT_US, '', 'SSL') . '">Contact Us</a></b>
        ');
      } else {        
  define('TEXT_BLANK_SIDEBOX', 
       '<a href="https://www.facebook.com/pages/XXXXXXXXX" target="_blank"><i class="fa fa-facebook"></i></a>
        <a href="https://twitter.com/XXXXXXXX" target="_blank"><i class="fa fa-twitter"></i></a>
        <a href="https://www.pinterest.com/XXXXXXXXXX" target="_blank"><i class="fa fa-pinterest"></i></a>
        <a href="https://www.youtube.com/user/XXXXXXXXXX" target="_blank"><i class="fa fa-youtube"></i></a>
        <br><br>
        <b><a href="' . zen_href_link(FILENAME_LOGIN, '', 'SSL') . '">  ' . HEADER_TITLE_LOGIN . '</a> 
        - <a href="' . zen_href_link(FILENAME_CONTACT_US, '', 'SSL') . '">Contact Us</a></b>
        ');
    }

I found it useful to have these links here since they do not show on the main page with only the slideshow.

Thanks for such a great template Anne!!!

;)

I am happy that you figured it out and posted your solution ;) With the responsive design you do have to be very careful about matching up closing html tags!

Thanks,

Anne

[batracy]

I struggled with this and found the fix.. actually 2 fixes I think are out there.. and they are related to the
includes/templates/******/jscript/jquery.slimmenu.min.js
file.

This thread offers one solution (I didn't try this one)..
https://www.zen-cart.com/showthread....ter-New/page60

and another (the one that worked for me) is found here..
https://github.com/adnantopal/slimme...limmenu.min.js

which uses this code..

(function(e,c,a,g){var d="slimmenu",f={resizeWidth:"768",collapserTitle:"Main Menu",animSpeed:"medium",easingEffect:null,indentChildren:false,childrenIndenter:"&nbsp;&nbsp;"};function b(i,h){this.element=i;this.$elem=e(this.element);this.options=e.extend({},f,h);this.oldwidth=0;this.init()}b.prototype={init:function(){var h=this.options,j=this.$elem,i='<div class="menu-collapser">'+h.collapserTitle+'<div class="collapse-button"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></div></div>',k;j.before(i);k=j.prev(".menu-collapser");j.on("click",".sub-collapser",function(m){m.preventDefault();m.stopPropagation();var l=e(this).closest("li");if(e(this).hasClass("expanded")){e(this).removeClass("expanded");e(this).find("i").html("▼");l.find(">ul").slideUp(h.animSpeed,h.easingEffect)}else{e(this).addClass("expanded");e(this).find("i").html("▲");l.find(">ul").slideDown(h.animSpeed,h.easingEffect)}});k.on("click",".collapse-button",function(l){l.preventDefault();j.slideToggle(h.animSpeed,h.easingEffect)});this.resizeMenu({data:{el:this.element,options:this.options}});e(c).on("resize",{el:this.element,options:this.options},this.resizeMenu);e(c).trigger("resize")},resizeMenu:function(l){var m=e(c),h=l.data.options,j=e(l.data.el),k=e("body").find(".menu-collapser");var i=m.width();if(c.innerWidth!==g){if(c.innerWidth>i){i=c.innerWidth}}if(i!=this.oldwidth){this.oldwidth=i;j.find("li").each(function(){if(e(this).has("ul").length){if(e(this).has(".sub-collapser").length){e(this).children(".sub-collapser i").html("▼")}else{e(this).append('<span class="sub-collapser"><i>▼</i></span>')}}e(this).children("ul").hide();e(this).find(".sub-collapser").removeClass("expanded").children("i").html("▼")});if(h.resizeWidth>=i){if(h.indentChildren){j.find("ul").each(function(){var n=e(this).parents("ul").length;if(!e(this).children("li").children("a").has("i").length){e(this).children("li").children("a").prepend(b.prototype.indent(n,h))}})}j.find("li").has("ul").off("mouseenter mouseleave");j.addClass("collapsed").hide();k.show()}else{j.find("li").has("ul").on("mouseenter",function(){e(this).find(">ul").stop().slideDown(h.animSpeed,h.easingEffect)}).on("mouseleave",function(){e(this).find(">ul").stop().slideUp(h.animSpeed,h.easingEffect)});j.find("li > a > i").remove();j.removeClass("collapsed").show();k.hide()}}},indent:function(k,j){var h="";for(var l=0;l<k;l++){h+=j.childrenIndenter}return"<i>"+h+"</i>"}};e.fn[d]=function(h){return this.each(function(){if(!e.data(this,"plugin_"+d)){e.data(this,"plugin_"+d,new b(this,h))}})}})(jQuery,window,document);

Hope that helps! Totally fixed my SlimMenu problems on the iphone.

-Andy

Thanks Andy (and Anne)!

Interesting note, I went to the second link you provided and got the code, uploaded it and found no change to the issue. However, when I copied the code embedded here on your response and uploaded it, works like a charm! So, for others with this issue, code at link doesn't work, code embedded here does.

Thanks again!

[picaflor-azul]

Thanks Andy (and Anne)!

Interesting note, I went to the second link you provided and got the code, uploaded it and found no change to the issue. However, when I copied the code embedded here on your response and uploaded it, works like a charm! So, for others with this issue, code at link doesn't work, code embedded here does.

Thanks again!

I am happy that you figured it out ;)

Thanks,

Anne

[Andy_M]

Anne,

How can I make it so the EZ Pages do not display in mobile or tablet view but do show on a normal website view??

as you can see here the EZ Page Menu (here titled "Stitching Topics") is kind of obtrusive on the mobile view..



Thanks!

Andy

[picaflor-azul]

Anne,

How can I make it so the EZ Pages do not display in mobile or tablet view but do show on a normal website view??

as you can see here the EZ Page Menu (here titled "Stitching Topics") is kind of obtrusive on the mobile view..



Thanks!

Andy

Turn off the sidebox in the Show Box @ Min-Width column if you do not want them to show on phones.

Thanks,

Anne

[Andy_M]

Thanks! Don't know why I missed that.

[picaflor-azul]

Thanks! Don't know why I missed that.

I am happy that you figured it out ;)

Thanks,

Anne

[peter-s]

Many Thanks for providing this incredible deign Anne,
This is my first website and I am learning quite a lot from it. However I have run into a brick wall of sorts, This is probably a very simple question to answer for some of you.

How do I change the font that is being used ? I have spend the last couple of hours trying to find out, but can't seem to find any clear information on how to do this simple thing :)

[peter-s]

Never mind, Found the answer :)
Added
<link href='http://fonts.googleapis.com/css?family=Josefin+Sans:600' rel='stylesheet' type='text/css'>
/public_html/includes/templates/dover_fine/common/html.header.php

[picaflor-azul]

Never mind, Found the answer :)
Added
<link href='http://fonts.googleapis.com/css?family=Josefin+Sans:600' rel='stylesheet' type='text/css'>
/public_html/includes/templates/dover_fine/common/html.header.php

Yes, just make sure it will validate:

<link href='http://fonts.googleapis.com/css?family=Josefin+Sans:600' rel='stylesheet' type='text/css' />

Thanks,

Anne