Bootstrap을 사용하여 Wordpress 위젯을 사이드 바에서 스타일을 지정하는 방법은 무엇입니까?

Question

저는 부트 스트랩을 사용하여 Wordpress 사이트를 만들고 있습니다. 사이드 바를 등록했고 사이드 바에 플러그인 (위젯)을 추가하고 있습니다. 나는 그들을 적절하게 스타일링하는 법을 모른다.

이것은 내가 가지고있는 것입니다. 10 포인트가 없기 때문에 이미지를 게시 할 수 없습니다. 현재 스크린 샷이 목록으로 표시됩니다 : 표준 레이아웃이있는 글 머리 기호 목록입니다. ,

다시

<div class="list-group"> 
    <a href="#" class="list-group-item active"> 
    Packing 
    </a> 
    <a href="#" class="list-group-item">Pricing</a> 
    <a href="#" class="list-group-item">Volume</a> 
</div> 

은 그래서 (크롬 개발자 도구에서) 다음과 같습니다

<aside id="recent_faqtax-2" class="widget recent-faqtax-widget"><h3 class="widget-title">FAQ</h3><ul> <li class="cat-item cat-item-10"><a href="http://www.mysite/topics/packing/" title="View all posts filed under Packing">Packing</a> 
</li> 
    <li class="cat-item cat-item-8"><a href="http://www.mysite/topics/pricing/" title="View all posts filed under Pricing">Pricing</a> 
</li> 
    <li class="cat-item cat-item-11"><a href="http://www.mysite/topics/volume-2/" title="View all posts filed under Volume">Volume</a> 
</li> 
</ul></aside> 

하지만, 부트 스트랩과 나는이를 만들려면 :

이는 HTML입니다 이미지는 없지만 부트 스트랩의 표준 활성 목록 그룹입니다.

어떻게해야합니까? 위젯 클래스에 jQuery 클래스를 추가해야합니까? 커스텀 CSS로 할 수 있습니까?

Answer 1

플러그인을 생성하는 코드를 수동으로 수정할 수 있습니다. 그러나 원하는 것을하는 가장 쉬운 방법은 사이드 바에 텍스트 상자를 추가하고 코드를 수동으로 작성하는 것입니다. 위젯 박스에서 출력으로

<div class="list-group"> 
    <a href="#" class="list-group-item active"> 
    Packing 
    </a> 
    <a href="#" class="list-group-item">Pricing</a> 
    <a href="#" class="list-group-item">Volume</a> 
    </div> 

: 그래서 당신은 뭔가를해야합니다

<aside id="recent_faqtax-2" class="widget recent-faqtax-widget"> 
<div class="list-group"> 
    <a href="#" class="list-group-item active"> 
    Packing 
    </a> 
    <a href="#" class="list-group-item">Pricing</a> 
    <a href="#" class="list-group-item">Volume</a> 
    </div> 
</aside>