Nav menu breaks in Static Parallax & arrows of Slider don't show up

1 reply · opened Dec 17, 2018

BburaksansalDec 17, 2018

Hello,

I have 2 problems which came up after upgrading to v.5 of Canvas theme. I re-uploaded the new /css /js /include folders many times and made the needed changes in my HTML files, but clearly there was something wrong on my end I think. Homepage is based on Static Parallax slider template, other pages are a mixture of various templates.

  1. I have 11 menu items on top: Logo first, then 11 menu items, then Top search. In v.4 the menu used to be all perfectly aligned. But when I switched to v.5, top nav menu breaks into the second line where the Header is. In the old version Logo was closer to left, Top Search was closer to right, so all 11 menu items were fit in the same line between Logo & Top Search. Now it's broken as you can see at http://allaboutturkey.us/top-sites.html or on all pages (except Homepage). How can I fix this and put everything aligned on top bar?

2a) The other problem is regarding Left/Right Arrows in Slider on the Homepage http://allaboutturkey.us/index.html . In v.4 they were showing but now with v.5 I can't see them (but I see icon-angle-down and also pagination on photos). How can I fix this to see left/right arrows again?

2b) Same as on issue #1, on the Homepage there were 11 nav menu items then I had to remove one after upgrading to V.5 because with 11 items the menu is breaking again on the second line falling on the photo. Now with 10 items the nav menu is aligned with Logo & Search, but if I add .with-arrows class in the primary menu then it breaks again.

Thank you in advance for your help.
Burak

SSemicolon WebSTAFFDec 23, 2018

Hello,

There have been quite a few changes in Canvas 5 related to Bootstrap and some upgrades to the Newest Versions of the included Plugins.

  1. This issue is related to the Bootstrap 4 upgrade which comes with Canvas 4. In Bootstrap 4, the width and structure of the Container was changed and thus this effects Canvas 4 as well. In order to fix this, you will need to do Additional CSS Changes. Consider using the following CSS Code:
#primary-menu ul li > a {
    padding-left: 12px;
    padding-right: 12px;
    font-size: 12px;
    letter-spacing: 0px;
}

2a. The Complete Changes for the Slider Features have been provided in the Documentation > Changelog > Version 5.0 Section. Please consider following them thoroughly. Additionally also check the HTML changes as provided slider-canvas.html File for the Navigation Arrows codes.

2b. Consider following the suggestion above for this issue.

This will definitely fix your issue. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard