WP-ShowHide

Опис

WP-ShowHide скрива део објаве иза дугмета, тако да нешто дугачко — саопштење за јавност, дневник промена, спојлер — не испуњава страницу док читалац то не затражи. Дугме приказује колико речи скрива, што је управо оно што Engadget ради са својим саопштењима за јавност. Пример употребе: [showhide type="pressrelease"]Саопштење за јавност иде овде.[/showhide]

Нема шта да се конфигурише и нема екрана са подешавањима. Сваки избор који додатак нуди јесте атрибут кратког кода који га прави, тако да се два преклопника у истој објави могу понашати другачије.

Могућности

• Један кратак код, [showhide], употребљив неограничен број пута у објави или на страници
• Блок Прикажи/сакриј за уређивач блокова, који држи садржај који скрива као обичне блокове и исцртава тачно оно што исцртава кратак код
• Дугме уместо везе, са aria-expanded и aria-controls, тако да преклопник ради са тастатуре и правилно се чита читачу екрана
• Ознаке које броје речи које скривају
• Без jQuery-ја и без икакве скрипте на страници која не користи ни кратак код ни блок
• Прилагођени DOM догађаји на сваком преклопнику, за теме које желе да реагују на њих

Донације

Провео сам већину свог слободног времена правећи, ажурирајући, одржавајући и пружајући подршку за ове додатке, па ако вам се заиста допадају моји додаци и можете да издвојите који долар, био бих вам веома захвалан. Ако не, слободно их користите без икаквих обавеза.

Употреба

1. Подразумевано, садржај унутар кратког кода showhide ће бити скривен.
2. Пример: [showhide]Садржај саопштења за јавност иде овде.[/showhide]

3. Подразумеване вредности: [showhide type="pressrelease" more_text="Show Press Release (%s More Words)" less_text="Hide Press Release (%s Less Words)" hidden="yes"]

4. Можете имати вишеструки showhide садржај унутар објаве или странице, једноставно коришћењем нове врсте.

5. Пример: [showhide type="links" more_text="Прикажи везе (%s више речи)" less_text="Сакриј везе (%s мање речи)"]Везе ће ићи овде.[/showhide]

6. Ако желите да подесите подразумевану видљивост на приказ.

7. Пример: [showhide hidden="no"]Садржај саопштења за јавност иде овде.[/showhide]

Уређивач блокова

Постоји и блок Прикажи/сакриј, смештен под Текст у уметнику блокова. Садржи садржај који скрива као обичне блокове — пасусе, слике, било шта — тако да се тај садржај пише и уређује на лицу места уместо да се куца у поље као ознака, и остаје видљив док уређујете. Панел Прикажи/сакриј у бочној траци носи иста четири избора која носе атрибути кратког кода: врсту, два натписа дугмета и да ли почиње скривено.

Кратак код је непромењен и даље подржан. Није застарео, објаве које га користе не захтевају уређивање, блок и кратак код исцртавају исте ознаке, а једна објава може садржати оба.

1. Садржај можете стилизовати помоћу CSS-а који ствара додатак. Овде је пример створеног HTML-а. Имајте у виду да је pressrelease подразумевана врста.

<div id="pressrelease-link-1" class="wp-showhide sh-link pressrelease-link sh-hide">
  <button type="button" class="sh-toggle" aria-expanded="false" aria-controls="pressrelease-content-1"
          data-sh-more="Show Press Release (4 More Words)"
          data-sh-less="Hide Press Release (4 Less Words)">Show Press Release (4 More Words)</button>
</div>
<div id="pressrelease-content-1" class="wp-showhide sh-content pressrelease-content sh-hide" hidden>Content</div>

1. Уз горњи пример, ево следећих стилова које можете користити у свом CSS-у:

.sh-link { }  
.sh-toggle { }  
.sh-content { }  
.pressrelease-link { }  
.pressrelease-link.sh-hide .sh-toggle { }  
.pressrelease-link.sh-show .sh-toggle { }  
.pressrelease-content { }  
.pressrelease-content.sh-hide { }  
.pressrelease-content.sh-show { }

1. Сваки преклопник покреће три догађаја на елементу .sh-link, и сва три се шире нагоре (bubble), тако да један ослушкивач на документу покрива сваки преклопник на страници: sh-link:more када се преклопник отвори, sh-link:less када се затвори и sh-link:toggle у оба случаја.