Možno ste už počuli o module pre WordPress, ktorý sa volá Advanced Custom Fields – ACF. Vo VISIBILITY tento modul používame snáď na každej webovej stránke, ktorá beží na WordPresse. Pomáha nám vytvárať ľahko upravovateľné stránky pre klientov bez toho, aby potrebovali znalosti z programovania. Preto som si pripravil tento článok, v ktorom vám tento prídavný modul trochu predstavím.

Ako to funguje?

ACF je v podstate súbor rôznych polí, ktoré môžete pridať do ľubovoľnej časti vášho webu. Napríklad také logo alebo citát spoločnosti, mapu s adresou vášho sídla či rôzne obsahové časti webu môžete mať natvrdo napísané v kóde webu alebo napríklad prostredníctvom ACF. V praxi to vyzerá asi takto:

Zápis v kóde pomocou ACF:

Telefónne číslo:
<?php 
if get(get_field('hotel_phone')){
    echo get_field('hotel_phone');
}
?>

Jednoduchá zmena vo WordPresse

field

Ak by ste to chceli napísať natvrdo, napríklad email, tak by to vyzeralo asi takto nejako:

<a href="mailto:recepcia@najhotelnasvete.sk">
  recepcia@najhotelnasvete.sk
</a>

Hlavný rozdiel je v tom, že ak obsah napíšeme natvrdo do kódu stránky, tak ho je aj treba meniť priamo v tomto kóde a to si vyžaduje zásah osobou aspoň so základnými znalosťami html a WordPressu. V prípade, že pri tvorbe webu použijeme zápis pomocou ACF v kóde a následne si vo WordPresse vytvoríme takého vlastné pole, tak napríklad zmena emailu bude spočívať v prepísaní jedného poľa v administračnom prostredí vašej WordPress stránky.

Ak máme vytvorený zápis v kóde, tak nám už ostáva len vytvorenie samotného poľa vo WordPresse

4

 

Môžeme vidieť, že ide o pomerne jednoduché spracovanie, ktoré nám ponúka viacero možností. Na obrázku pracujeme s poľami, sú to napr.:

  • Text
  • Obrázok
  • Google mapa
  • Zaškrtávacie pole s hodnotou áno/nie
  • Súbor, ktorý bude napríklad stiahnutie

Označenie poľa nám určuje, aký text sa bude vo WordPresse zobrazovať pri jeho úprave a pomáha nám orientovať sa. Meno poľa je jeho označenie, ktorým ho zavoláme v kóde, tak ako sme to mohli vidieť v predchádzajúcich obrázkoch.

Toto je len malá časť možných polí, avšak už samy o sebe ukazujú pozoruhodné možnosti, ktoré môžeme využiť pri tvorbe webu.

Máme vytvorené a nastavené potrebné polia? Výborne, už nám ostáva len nastavenie logiky ich zobrazenia.

5

V tejto časti si môžete nastaviť, pre ktoré časti vašej stránky sa majú tieto polia zobrazovať. Môžete si nastaviť, aby sa zobrazovali napríklad len pre blogové články a nie pre konkrétny custom post s menom „benefit” alebo iba na front-page atď.

 

Vďaka Advanced Custom Fields bude web výrazne ľahšie editovateľný. Na jeho správu a editáciu v rámci naprogramovanej dynamickej štruktúry nebude treba nijaké špecifické znalosti. To môže znížiť náklady na správu takéhoto webu. Dôležitejšie je však to, že stránka je z technického aspektu aktuálna, pretože už pri jej vývoji sa predpokladá nutnosť editácie jednotlivých obsahových prvkov vzhľadom na vyvíjajúce sa trendy, zmenu údajov či iného obsahu vašej webovej stránky. Na druhej strane, tvorba takéhoto webu si vyžaduje aj pomerne viac času a pri plnom využití potenciálu ACF je o niečo náročnejšia. To  sa nám však vráti práve vďaka jeho jednoduchej úprave v budúcnosti a celkovo vyššej kvalite webovej stránky.

Tip na záver:

Na záver som si pre vás pripravil ešte jeden tip, ktorý zjednoduší prvý zápis na jeden riadok s možnosťou zobrazenia alternatívneho textu v prípade nevyplneného poľa.

Ak si vložíte do súboru funkcions.php týchto pár riadkov kódu, tak vám to uľahčí prvý zápis poľa na jeden riadok.


function field($fieldName, $defaultValue = '', $before = '', $after = '') {
    if (get_field($fieldName, get_the_ID())) {
        return $before . get_field($fieldName, get_the_ID()) . $after;
    } else {
        return $defaultValue;
    }
}

Táto úprava vám uľahčí zápis kódu pre zobrazenie poľa na:


<?php echo field('name','empty','before ','after'); ?>

Samozrejme, jednotlivé hodnoty upravíme podľa aktuálnej situácie podľa nasledujúce kľúča:

  • Name – meno kľúča napr. company_name
  • Empty – čo sa má zobraziť ak je pole prázdne? Toto môže zostať aj prázdne
  • Before – čo sa má zobraziť bezprostredne pred polom, napr. <h1>
  • After – čo sa má zobraziť bezprostredne za polom, napr. </h1>

Uvediem príklady, keď existujú dve polia: „tel“ a „tel2“, kde tel bude vyplnené a tel2 ostane prázdne:

 

Príklad 1:
php:


Telefónne číslo: <?php echo field('tel'); ?><br>

Telefónne číslo 2: <?php echo field('tel2'); ?>

zobrazenie:

Telefónne číslo: 09XX XXX XXX
Telefónne číslo 2:

Príklad 2:
php:


Telefónne číslo: <?php echo field('tel','nevyplnené'); ?><br>

Telefónne číslo 2: <?php echo field('tel2','nevyplnené'); ?>

zobrazenie:

Telefónne číslo: 09XX XXX XXX
Telefónne číslo 2: nevyplnené

Príklad 3:
php:


<?php echo field('tel','','Telefónne číslo: ','<br>'); ?>

<?php echo field('tel2','','Telefónne číslo 2: '); ?>

zobrazenie:

Telefónne číslo: 09XX XXX XXX