如何在Magento主頁旁邊的flexslider中添加兩個橫幅？

我在我的網站中有一個camera.js滑塊，我替換爲Flexslider。我這樣做是因爲我無法使camera.js滑塊可點擊，我想擺脫'點擊此處'按鈕。現在我有我的網站上安裝的flexslider我想帶回兩個橫幅，哪裏在我的camera.js滑塊旁邊的我的網站，但我不明白它的工作...如何在Magento主頁旁邊的flexslider中添加兩個橫幅？

這是我的主頁，因爲你可以看到橫幅不顯示在滑塊上的權利，但他們表現出在錯誤的地方：

http://imgur.com/j8PVOuR

我想有兩個橫幅在尺寸381 X 219在滑塊的右側，一個以上另一個。

的代碼如下：

<div class="container"> 
<div class="row"> 
<div class="span12"> 
<script type="text/javascript">// <![CDATA[ 
jQuery.noConflict(); 
{{widget type="cms/widget_block" template="cms/widget/static_block/default.phtml" block_id="25"}} 
</script> 
<ul class="banner-block-right"> 
<li><a href="{{store url='nieuwe-producten'}}"> <img src="{{skin url='images/media/banners-8.png'}}" alt="" /> </a></li> 
<li><a href="{{store url='klantenservice'}}"> <img src="{{skin url='images/media/banners-7.png'}}" alt="" /> </a></li> 
</ul> 
</div> 
</div> 
</div>

只是爲了clearify：

我使用的代碼：腳本類型= 「文本/ JavaScript的」> //等

因爲我在導航欄中遇到問題，所以當我將新滑塊插入時，它不再工作。

我把滑塊放在小部件中，只是因爲我認爲這會更容易。

所以我的問題是，在代碼中必須做些什麼調整才能在flexslider旁邊放置兩個小橫幅？

Btw。當我使用該腳本來讓我的導航欄工作時，默認的magento定價佈局又回來了，就像是讓導航欄工作或以正確的佈局獲取magento定價。我選擇導航欄哈哈，有人知道這個問題的解決辦法嗎？

編輯：flexslider

/* 
* jQuery FlexSlider v2.0 
* http://www.woothemes.com/flexslider/ 
* 
* Copyright 2012 WooThemes 
* Free to use under the GPLv2 license. 
* http://www.gnu.org/licenses/gpl-2.0.html 
* 
* Contributing author: Tyler Smith (@mbmufffin) 
*/ 


/* Browser Resets */ 
.flex-container a:active, 
.flexslider a:active, 
.flex-container a:focus, 
.flexslider a:focus {outline: none;} 
.slides, 
.flex-control-nav, 
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles 
*********************************/ 
.flexslider {max-width: 700px; margin: -20; padding: 0;} 
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */ 

.flexslider .slides img { 
    display: block; 
    max-width: 100%; height: auto; margin: - auto; 
}

來源

2016-06-08 JLS911

的CSS代碼，這取決於你的CSS。

檢查：

您的橫幅塊右類沒有上一個「清晰的」樣式規則。「清除」清除浮游物。
檢查滑塊和橫幅塊右側是否有浮動規則。
檢查滑塊是否太寬。

如果它不起作用，也許你可以發佈你的CSS的相關部分。看到網頁

問題後

更新是你的UI元素沒有嵌套的DIV行內。檢查您的網頁給我以下嵌套結構：

<div class="container"> <div class="row"> <div class="span12"> <script type="text/javascript"> <script src="http://www.site.nl/js/magestore/bannerslider/jquery.flexslider.js"> <link media="all" href="http://www.site.nl/skin/frontend/base/default/css/magestore/bannerslider/flexslider.css" type="text/css" rel="stylesheet"> <script type="text/javascript"> <div class="flexslider flexslider-7-1"> <script type="text/javascript"> </div> </div> <script type="text/javascript"> </div> <ul class="banner-block-right">

因此，您的小部件正在關閉。容器和.row divs。您插入的模板可能需要在最後關閉標籤。

來源

2016-06-08 12:37:54 Ron

我試圖清除樣式，但我沒有得到它的工作... – JLS911

我用flexslider的CSS代碼更新了原始文章，滑塊的最大寬度應該是正確的，它是700px。橫幅塊有一個float：right，rule。 – JLS911

嘗試賦予.flexslider類float：left; – Ron

啊哈！這幫助我了！現在它是如何成爲的！非常感謝你！

我擺脫了小部件，並且在3個關閉div之後我將代碼粘貼到了cms。現在它也是響應式的:)

唯一仍然存在的問題是，因爲使用腳本來保持下拉工作，它將定價的佈局更改爲默認的magento ...怎麼做我解決這個問題？

來源

2016-06-08 15:00:05 JLS911

和事情是它將橫幅放在一個奇怪的地方，當寬度967至1167 – JLS911

如何在Magento主頁旁邊的flexslider中添加兩個橫幅？

回答

相關問題