2014-04-17 1 views
1

Shopify에서 flexslider에 캡션을 추가하려고합니다. 이 내 theme.liquidShopify의 CSS 문이 작동하지 않습니다.

  {% for i in (1..10) %} 
      {% capture display_slideshow %}display_slideshow_{{ i }}{% endcapture %} 
      {% capture slide %}slideshow_{{ i }}.jpg{% endcapture %} 
      {% capture link %}image_{{ i }}_link{% endcapture %} 
      {% capture alt %}image_{{ i }}_alt{% endcapture %} 
      {% capture caption %}image_{{ i }}_caption{% endcapture %} {% comment %} <-- I am adding this one {% endcomment %} 

      {% if settings[display_slideshow] %} 
      <li class="slide"> 
        <img src="{{ slide | asset_url }}" data-url="{{ settings[link] }}" class="slide-img" alt="{{ settings[alt] }}" /> 
      <p class="flex-caption">{{ settings[caption] }}</p> {% comment %} <-- I am adding this one {% endcomment %} 
      </li> 
      {% endif %} 
     {% endfor %} 

내 shop.css.liquid

에 코드를 내가 뭔가를 아직 자막이 적용되지 않는 경우에도 배경을 보여주는

{% if settings.caption %} 

.flex-caption 
{ 
    position:absolute; 
    right:0; 
    bottom:20px; 
    z-index:1; 
    background:rgba(0, 0, 0,0.6); 
    padding:20px 0 10px 10px; 
    height:33px; 
    width:500px; 
    color:#FFF; 
} 

{% endif %} 

를 추가하고있다.

+1

은 'settings.caption' 전역 설정입니다 (예 : 모든 슬라이드에서 캡션 사용 가능) 또는 슬라이드 별 설정이어야합니까? – hjblok

+0

아니요, 글로벌 설정이 아닙니다. 전역으로 설정하려면 어떻게해야합니까? 나는 Shopify에 매우 익숙하다. – tigerisme

답변

0

각 슬라이드마다 캡션 텍스트 상자를 추가하고 settings.caption! = ""(빈 문자열이 아닌지)를 확인하려고합니다.

css 클래스를 망치지 않고 슬라이드가없는 슬라이드에 캡션 요소를 출력하지 않는 것이 더 쉬운 옵션 일 수 있습니다.

더 여기이 도움이 http://docs.shopify.com/themes/theme-templates/settings#settings-object-in-liquid

희망 읽어 보시기 바랍니다.

관련 문제