Нови Сад – Вордпрес радионице за почетнике

У суботу 28. септембра, почеће са радом Вордпрес радионице за почетнике. Радионице ће трајати три месеца и одржаваће се у новосадском Старит центру.

Свако је добродошао да присуствује уз претходну обавезну регистрацију. Од опреме је потребан само лаптоп и жеља за учењем свега што Вордпрес има да понуди.

Програм радионица

После уводног предавања 28. септембра, радионице ће покрити следеће области:

  • Шта је Вордпрес?
  • WordPress.com и WordPress.org
  • Прављење WordPress.com веб места и истрживање опција
  • Гутенберг и Класични едитор
  • Инсталација WordPress.org веб места у локалном окружењу и уживо
  • FTP и базе података
  • HTML/CSS
  • Вордпрес теме, инсталација и хијерархија фајлова
  • Изведена тема (child theme)
  • Вордпрес додаци
  • Вордпрес куке – акције и филтери
  • Прављење продавнице
  • Прављење чланства
  • SEO
  • Оптимизација слика ради побољшања брзине Вордпрес веб места
  • Backup
  • Различите грешке и дебаговање
  • Миграције
  • WP CLI
  • Вордпрес подршка
  • Волонтирање
  • Како живети од Вордпреса?

Све детаље можете наћи у званичној објави. Видимо се 28. септембра!

Нови Сад – 14 Радионица за израду Вордпрес тема, 20 април 2019

Последња радионица за израду Вордпрес тема је одржана у суботу, 20 априла у новосадском Стартит Центру. Овог пута смо зашли у функционалност која се на wordpress.org сматра области додатака а не тема – прилагођена мета поља и примена додатка Advanced Custom Fields. Али пре тога, размотрили смо је дан од начина на који тема може препоручити додатке који помажу комплетнијом употребом особина теме.

TGM Plugin Activation

TGM Plugin Activation је библиотека која омогућава препоруку додатака на веома једноставан начин. Омогућава корисницима да поставе и ажурирају изабране додатке у природном окружењу Вордпресове контролне табле.

Могуће је препоручити или захтевати наведене додатке, чак их и аутоматски укључити и искључити заједно са укључивањем теме, захтевати одређену верзију додатка итд. Додаци који се препоручују могу бити на различитим местима – у самој теми, на wordpress.org/plugins, Github-у и сл.  

Прилагођена мета поља

Доласком новог уређивача у 5.0 верзији Вордпреса, и његовим активним развојем, све је мања потреба за прилагођеним мета пољима. Ипак, погледали смо шта је то што је неопходно за правилну примену прилагођених поља:

  1. Регистрација мета кутије – add_meta_box(), add_meta_boxes копча акције.
  2. Markup за приказ мета кутије – обавезно користити wp_nonce_field().
  3. Чување вредности мета поља – wp_verify_nonce() провера и санитизација података за чување у бази; save_post копча акције.

Advanced Custom Fields

Advanced Custom Fields је додатак који користи различита поља и њихове комбинације како би олакшао унос садржаја за компликоване распореде и шаблоне. Омогућава једноставно додељивање прилагођених поља било ком објекту Вордпреса, било да је то чланак, страница, таксономија или корисник.

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

Advanced Custom Fields и нови уређивач

Тренутне верзије додатка су 5.7.12 за бесплатну и 5.7.13 за Pro верзију. Ове верзије нису компатибилне са новим уређивачем. Једини начин да се овај додатак користи у последње две верзије Вордпреса је уз Disable Gutenberg додатак.

Ипак, ускоро можемо очекивати и нову, 5.8.0 верзију која је у потпуности компатибилна са уређивачем и нуди додатну функционалност регистровања блокова. У овом тренутку постоји 5.8.0-RC2 (release candidate) који је доступан свима који имају девелоперску лиценцу.

Функције

Advanced Custom Fields додатак прати Вордпресову конвенцију именовања функција што значајно утиче на веома брзо усвајање од стране девелопера.

Најосновнији начин долажења до вредности поља је помоћу функција get_field() и the_field(), при чему већ по називима функција можемо закључити да прва враћа вредност док је друга приказује.

Петља је, такође, веома слична Вордпресовој подразумеваној петљи, па тако имамо have_rows() и the_row() функције у основној петљи Advanced Custom Fields додатка.

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

Документација

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

acf-json

Синхронизација поља на различитим инсталацијама Вордпреса је у ранијим верзијама додатка била извор огромне фрустрације. Међутим, данас је довољно у теми направити acf-json директоријум и сва поља ће се аутоматски сачувати у облику .json датотека, и бити спремна за синхронизацију одмах након ажурирања.

На радионици само се укратко упознали са Text, Textarea, Image, WYSIWYG, Select, Relationship field, Flexible content, Repeater и Clone распоредом, као и са употребом условљене логике за приказивање поља. Ово је заиста само мали део могућности Advanced Custom Fields додатка.


Комплетан код са радионице се може преузети са званичног налога Вордпрес Србија заједнице на Github-u.

Нови Сад – 13 Радионица за израду Вордпрес тема, 30 март 2019

Тринаеста радионица за израду Вордпрес тема је одржана у суботу, 30 марта у новосадском Стартит Центру. Овог пута смо се посветили додатку који проширује могућности подразумеваног прилагођавача (Customizer), користећи при томе, исти API.

Кирки

Обзиром да је додатак, Кирки се кроз тему може препоручити крајњим корисницима на неколико начина. Ми смо се одлучили за додавање тзв. инсталер скрипте која ће препоручити додатак оног тренутка када се отвори прилагођавач и врло једноставно, притиском на једно дугме, поставити додатак у инсталацију Вордпреса.

Пошто користи подразумевани API, додавање панела и секција је исто као и без додатка. Међутим, оно што овај додатак чини толико популарним и корсиним је велики број доступних контрола, као и сам начин на који се контроле додају у тему.

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

Сваку од ових контрола веома једноставно додајемо у прилагођавач помоћу kirki/fields филтера, који филтрира низ контрола и додаје нове.

Типографија

Контрола за типографију нуди читав низ подешавања који крајњем кориснику могу дати огромну контролу над сваким аспектом типографије веб места. Све фамилије са Google Fonts су доступне а могуће је филтрирати према разним стандардима (serif, sans-serif и monospace) и варијантама (regular, italic, bold итд). Оно што нисмо успели да пронађемо је како дефинисати subset.

Прекидач (Switch)

Прекидач нам пружа једноставну функционалност укључивања и искључивања било чега: неке друге контроле или неког дела веб места. Овде треба обратити пажњу на вредности дефинишемо (string) и које прекидач враћа (bool).

Уз помоћ active_callback аргумента додатог било којој другој контроли а који проверава вредност прекидача, врло лако можемо ту контролу да прикажемо одн. сакријемо једноставном применом прекидача. Ми смо искористили ову функционалност за приказивање и сакривање контроле типографије.

Група радио дугмића (Radio Buttonset)

Слично прекидачу, група радио дугмића се може користити за укључивање и искључивање али и у многе друге сврхе. Овде можемо имати неограничен број опција и већу контролу над вредностима које се враћају.

Палета боја

Палета боја је изузетно корисна када желите крајњим корисницима да пружите могућност промене боја на веб месту. Како бисмо применили ове боје као прилагођене стилове, користили смо Heredoc и wp_add_inline_style().

Сортирање (Sortable)

Помоћу Киркија можемо врло лако да мењамо редослед различитим елементима. Контрола за сортирање чак нуди и могућност укључивања и искључивања елемената притиском на иконицу која приказује око.

Поље са вишеструким потврдама (Multicheck)

Пре него што смо сазнали да се елементи за сортирање могу укључити и искључити у склопу контроле за сортирање, ову функционалност видљивости смо добили употребом поља са вишеструким потврдама. Употребом ове контроле се веома једноставно може постићи велика флексибилност и прилагодљивост теме.

Понављач (Repeater)

Понављач је изузетно корисна контрола сваки пут када је потребно непознати број пута поновити одређену контролу, или групу контрола при чему је могуће ограничити максимални број понављања. Ми смо употребили понављач за ираду клизача чланака (slider). Овом приликом смо се користили једном од неколико доступних метода Киркијеве помоћне класе, Kirki_Helper::get_posts().


Комплетан код са радионице се може преузети са званичног налога Вордпрес Србија заједнице на Github-u.

Следећи термин посвећујемо прилагођеним пољима и додатку за проширивање ове функционалности – Advanced Custom Fields.

Радионице су бесплатне али је потребно пријавити се на Meetup групи Вордпрес Србија заједнице.

Нови Сад – 12 Радионица за израду Вордпрес тема, 16 март 2019

Дванаеста радионица за израду Вордпрес тема је одржана у суботу, 16 марта у новосадском Стартит Центру. Овај термин смо посветили прилагођавачу (Customizer).

Објекти прилагођавача

Прилагођавач је сачињен од четири типа објекта: панел, секција, подешавање и контрола. Сваки од њих има три метода, add_, get_ и remove_, који нам омогућавају да прилагодимо прилагођавач различитим потребама. За било какво прилагођавање користимо customize_register копчу акције.

Панел

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

Важно је имати у виду да панел мора да има бар једну секцију да би био видљив у прилагођавачу. Исто тако, да би секција била видљива у прилагођавачу, мора да садржи бај деан пар подешавања и контроле.

Доступне методе: add_panel, get_panel и remove_panel.

Секција

Секција може бити самостална а може и да, поред других секција, припада панелу. Све подразумеване секције су самосталне. За додавање нове секције користимо add_section метод WP_Customize_Manager објекта док за уклањање користимо remove_section. За промену било ког аргумента подразумеване секције користимо get_section.

Подразумеване секције су:

Назив ID Приоритет (Редослед)
Site Title & Tagline title_tagline 20
Colors colors 40
Header Image header_image 60
Background Image background_image 80
Menus (Panel) nav_menus 100
Widgets (Panel) widgets 110
Static Front Page static_front_page 120
default 160
Additional CSS custom_css 200

Доступне методе: add_section, get_section и remove_section.

Подешавање

Подешавање увек иде у пару са контролом. Овде се дефинише да ли ће вредност контроле бити сачувана као option или theme_mod, подразумевана вредност контроле, начин приказивања промене у самом прилагођавачу итд.

Препоручује се да јединствени назив подешавања, ID, буде исти као и контролин јер ово омогућава лакше динамичко приказивање вредности код неких контрола, као што су select и radio.

Доступне методе: add_setting, get_setting и remove_setting.

Контрола

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

Подразумевана подешавања и контроле:

Назив ID Секција
Site Title blogname title_tagline
Tagline blogdescription title_tagline
Display Site Title and Tagline header_text title_tagline
Site Icon site_icon title_tagline
Logo custom_logo title_tagline
Header Text Color header_textcolor colors
Background Color background_color colors
Header Image header_image header_image
Header Image Data header_image_data header_image
Header Video header_video header_image
External Header Video external_header_video header_image
Background Image background_image background_image
Preset background_preset background_image
Image Position background_position background_image
Image Size background_size background_image
Repeat Background Image background_repeat background_image
Scroll with Page background_attachment background_image
Your homepage displays show_on_front static_front_page
Homepage page_on_front static_front_page
Posts page page_for_posts static_front_page
CSS code custom_css custom_css

Доступне контроле:

  • text,
  • textarea,
  • email,
  • url,
  • radio,
  • select,
  • number,
  • checkbox,
  • dropdown-pages,
  • password,
  • hidden и
  • date.

Доступне напредне контроле:

  • WP_Customize_Image_Control,
  • WP_Customize_Color_Control,
  • WP_Customize_Media_Control,
  • WP_Customize_Upload_Control,
  • WP_Customize_Background_Image_Control,
  • WP_Customize_Background_Position_Control,
  • WP_Customize_Cropped_Image_Control,
  • WP_Customize_Site_Icon_Control,
  • WP_Customize_Theme_Control,
  • WP_Customize_Code_Editor_Control,
  • WP_Customize_Date_Time_Control

Доступне методе: add_control, get_control и remove_control.

Селективно освежавање

Како би корисничко искуство живог прегледа промена у прилагођавачу било што ефикасније, уместо освежавања целе странице, могуће је освежавање само елемента који се мења на страници. Ово се постиже transport параметром у подешавању и додавањем подешавања у selective_refresh објект.

Санитизација

Сваку вредност коју добијамо као унос корисника је неопходно припремити за похрањивање у базу података. Тај процес се назива санитизација.

У Вордпресу постоје готове функције које врше санитизацију за одређене типове вредности. Називи већине ових функција започињу са sanitize_.

За вредности које можемо очекивати из прилагођавача а за које не постоје припремљене функције, санитизацију вршимо помоћу прилагођених функција. Вордпресов тим за преглед тема, WPTRT, је припремио низ примера доступних на Github-u.


Комплетан код са радионице се може преузети са званичног налога Вордпрес Србија заједнице на Github-u.

Следећи термин ћемо посветити напреднијом употребом прилагођавача помоћу Кирки додатка.

Радионице су бесплатне али је потребно пријавити се на Meetup групи Вордпрес Србија заједнице.

Нови Сад – 10 Радионица за израду Вордпрес тема, 16 фебруар 2019

Десета радионица за израду Вордпрес тема је одржана у суботу, 16 фебруара у новосадском Стартит Центру. Бавили смо се подршком теме за нови уређивач, познат под називом Гутенберг.

Учитавање стилова и скрипти

За учитавање скрипти и стилова за блокове и њихов уређивач користимо исте функције као и до сада, wp_enqueue_scripts и wp_enqueue_styles. Разликују се једино имена копчи за које везујемо позиве.

еnqueue_block_assets – Примењује се и на уређивач блокова и на фронтенд. Корисно је када желимо да нам блокови изгледју и понашају се исто и у уређивачу и на фронтенду.  

enqueue_block_editor_assets – Примењује се само на уређивач те се најчешће користи у додацима.

Подршка теме

Нови уређивач је донео низ нових могућности које тема може да подржава.

add_theme_support( ‘align-wide’ );

Широко поравнање подразумева две нове могућности, широко поравнање и пуну ширину. У самом уређивачу се примењује одмах након додавања подршке док је за фронтенд потребан додатни CSS како би се нове ширине примениле.

add_theme_support( ‘wp-block-styles’ );

Сви блокови долазе са предефинисаним стиловима у уређивачу. Уколико желимо да применимо ове стилове и на фронтенд, то можемо урадити укључивањем подршке за стилове блокова. У зависности од теме и њених већ постојећих стилова, неопходно је додати мање или више CSS-а у стилове теме како би се сви стилови из уређивача применили и на фронтенд.

add_theme_support( ‘editor-font-sizes’ );

Уређивач дозвољава корисницима да мењају величину фонта. Осим неколико предефинисаних величина, корисници могу дефинисати било коју величину за текст који уносе. Ове предефинисане величине је могуће променити помоћу подршке за величину фонта.

За савку нову величину ће се генерисати нова класа по следећем моделу:

.has-{ВЕЛИЧИНА}-font-size  

При чему је ВЕЛИЧИНА заправо slug који смо доделили прилагођеној величини. Подразумеване величине за које класе већ постоје су: small, regular, medium, large, huge и larger.

add_theme_support( ‘disable-custom-font-sizes’ );

Уколико желимо да онемогућимо коришћење било које величине осим дефинисаних, можемо да укључимо подршку за онемогућавање прилагођених величина.

add_theme_support( ‘responsive-embeds’ );

Подршка за пуну ширину угњежђивања на свим уређајима, при чему су очуване пропорције на свакој величини екрана.

add_theme_support( ‘editor-color-palette’ );

Као и величине фонта, уређивач има предефинисане палете боја које се могу применити као боја текста и боја позадине за поједине елементе. Такође, CSS класе се генеришу по истом принципу као и за величину фонта.  

.has-{БОЈА}-color

.has-{БОЈА}-background-color

Предефинисане боје су: pale-pink, vivid-red, luminous-vivid-orange, luminous-vivid-amber, light-green-cyan, vivid-green-cyan, pale-cyan-blue, vivid-cyan-blue, very-light-gray, cyan-bluish-gray и very-dark-gray, а осим ових боја такође је могуће користити било коју боју.

Подразумеване боје је могуће заменити прилагођеном палетом путем подршке теме.

add_theme_support( ‘disable-custom-colors’ );

Такође, уколико желимо да онемогућимо коришћење боја које нису предефинисане, можемо то да урадимо укључивањем подршке теме.


Комплетан код са радионице се може преузети са званичног налога Вордпрес Србија заједнице на Github-u.

У следећем термину настављамо са уређивачем: правимо шаблоне блокова и мењамо појединости предефинисаних блокова уз помоћ доступних филтера.

Радионице су бесплатне али је потребно пријавити се на Meetup групи Вордпрес Србија заједнице.

Нови Сад – 9 Радионица за израду Вордпрес тема, 02 фебруар 2019

Девета радионица за израду Вордпрес тема је одржана у суботу, 02 фебруара у новосадском Стартит Центру. Упознали смо се са функцијама за интернационализацију и алатима за локализацију теме.

Једноставни текст

Када у кôду имамо једноставан текст без динамичких вредности или елемената специфичних за одређени језик (као што су бројеви, датум и време), можемо користити неколико функција за интернационализацију, у зависности од места на коме се текст налази и коју улогу игра.

__(), _e() – најједноставнија функција која враћа, одн. принта текст и замењује га локализованим преводом, уколико постоји.  

esc_html__(), esc_html_e() – преводи исто као и горе неведене функције, и врши escaping за HTML.

esc_attr__(), esc_attr_e() – преводи исто као и горе неведене функције, и врши escaping за атрибуте.

Контекст

Функције за додавање контекста не праве никакву разлику у самом процесу и функционалности локализације али су од великог значаја за преводиоца.

Конкретно у енглеском језику постоје речи које се исто пишу као глагол и као именица али имају потпуно другачије значење: post (именица: чланак; глагол: послати), book (именица: књига; глагол: резервисати) итд.

У оваквим случајевима контекст представља огромну помоћ да се, без потребе гледања у кôд, израз прецизно преведе.

_x(), _ex() – функција са контекстом која враћа, одн. принта текст и замењује га локализованим преводом, уколико постоји.

esc_html_x(), esc_attr_x() – преводе исто као и горе неведене функције, и врше escaping за HTML, одн атрибуте.

Једнина и множина

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

Помоћу ових функција алати за локализацију препознају да треба да примењују адекватан формат множине за дати локал.

_n(), _nx() – у зависности од прослеђеног броја враћа стринг за једнину или за множину.

Формат броја

Функција за форматирање броја користи глобалну варијаблу $wp_locale, како би број био правилно форматиран за дати локал (сепаратор за хиљаде и децимална тачка).

Нпр.

САД – 1,024.00

РС – 1.024,00

number_format_i18n() – не ставља се у функцију за интернационализацију али се враћена врдност може користити за приказ броја у склопу локализованог стринга.

Најчешћи пример у Вордпресу се може наћи у шаблону за коментаре (приказ броја коментара) где имамо примену функције за форматирање броја као и за препознавање једнине и множине:

printf(
	/* translators: 1: number of comments, 2: post title */
	_nx(
		'%1$s Reply to %2$s',
		'%1$s Replies to %2$s',
		get_comments_number(),
		'comments title',
		'radionica'
	),
	number_format_i18n( get_comments_number() ),
	get_the_title()
);

Формат датума и времена

Као и код форматирања броја, функција за локализовање датума и времена користи глобалну варијаблу $wp_locale у којој су, између осталог, сачувани називи месеци и дана у недељи за сваки локал.

date_i18n() – такође се користи ван функције за интернационализацију али може да проследи своју вредност једној таквој функцији.

Језичка целина

Приликом писања кôда и припреме за интернационализацију, веома је важно имати у виду да различити локали имају различиту језичку синтаксу и користи различит редослед речи у реченици за исказивање исте садржине.

Због овога је важно задржати логичну језичку целину у истом стрингу. Ово није проблем уколико не постоји динамичка вредност унутар целине, међутим, у ситуацијама када се динамичке вредности нађу унутар целине девелопери понекад прибегавају “лакшем” решењу и исцепкају целину на мање делове. Ово треба по сваку цену избегавати.

Како би се сачувала целина најчешће се користе следеће PHP функције: sprintf() и printf().

Алати за локализацију

Од бројних алата за локализацију који су данас доступни, у радионици смо се упознали са два: Poedit и Loco додатак.

Poedit је самостални алат и захтева добру припрему пре самог генерисања стрингова за превод. Уколико не знате које све функције и у ком формату треба да буду кориштене као кључне речи за претагу кôда, јако тешко ћете постићи потпуну локализацију.

У подешавањима кључне речи изгледају овако (све функције за интернационализацију које смо користили):

"X-Poedit-KeywordsList: __;_e;_x:1,2c;_ex:1,2c;_n:1,2;_nx:1,2,4c;_n_noop:1,2;_nx_noop:1,2,3c;esc_attr__;esc_html__;esc_attr_e;esc_html_e;esc_attr_x:1,2c;esc_html_x:1,2c\n"

Loco је додатак за Вордпрес који служи искључиво за локализацију. За разлику од осталих додатака, он посетиоцима веб места не даје могућност пребацивања садржаја на све доступне локале. Он приказује само онај локал који је изабран у контролној табли.

Међутим, оно што овај додатака издваја од осталих је могућност генерисања свих стрингова за превод и превођења директно из контролне табле. За овај додатак је довољно да само изаберете локал и он ће сам прегледати све функције.

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

WP-CLI

wp i18n make-pot path/to/your-theme-directory

grunt-wp-i18n

Транслитерација

Српски језик је један од ретких који користи два писма, ћирилицу и латиницу. Како се транслитерација врши само из ћирилице у латиницу (обрнути смер даје грешке у многим ситуацијама), иницијални превод се врши на ћирилици.

Затим је транслитерацију могуће остварити путем додатака, ми смо користили SrbTransLatin али он није једини додатак који обавња ову функцију.

Датотеке

Постоје три врсте датотека које учествују у процесу локализације Вордпреса.

POT (Portable Object Template)

.pot – Генерише се из gettext функција у кôду. Ова датотека која садржи све стрингове за превођење, пронађене у теми, додатку или било којој претходно изабраној фасцикли. Стрингови су најчешће на енглеском језику.

Стринг из .pot датотеке:

#. 1: number of comments, 2: post title
#: template-localisation.php:182
#, php-format
msgctxt "comments title"
msgid "%1$s Reply to %2$s"
msgid_plural "%1$s Replies to %2$s"
msgstr[0] ""
msgstr[1] ""

PO (Portable Object)

.po – Генерише се из .pot датотеке и ова датотека која је њена скоро идентична копија. Разлика је у дефинисању специфичности локала: назив језика, форма множине и сл. У ову датотеку се, ручно или путем неког алата, уписује превод на жељени локал.

Горе наведени стринг али из .po датотеке за српски локал:

#. 1: number of comments, 2: post title
#: template-localisation.php:182
#, php-format
msgctxt "comments title"
msgid "%1$s Reply to %2$s"
msgid_plural "%1$s Replies to %2$s"
msgstr[0] ""
msgstr[1] ""
msgstr[2] ""

MO (Machine Object)

.mo – Генерише се из .po датотеке, потпуно је нечитљива људима и ово је заправо датотека коју Ворпрес чита и користи за локализацију. За ову датотеку је јако важно како је названа и њено име ће да зависи од фасцикле у којој се налази.

Локација и име .mo датотеке

Када се у контролној табли Вордпреса промени језик, истог тренутка се у фасцикли wp-content генерише languages фасцикла. Ту су све датотеке за локализацију свих тема и додатака пронађених у инсталацији Вордпреса а које је Вордпрес преузео са translate.wordpress.org. Теме и додаци овде имају своје засебне фасцикле а именовање датотека се врши према шеми:

ИМЕ-ТЕМЕ-ЛОКАЛ.mo (radionica-sr_RS.mo, radionica-sr_RS.po)

Уколико датотеке за локализацију одређене теме или додатка не постоје на translate.wordpress.org, Вордпрес ће покушати да их пронађе у корену теме, одн. додатка. У ово случају се изоставља назив теме/додатка из назива датотеке и остаје само ознака за локал (sr_RS.mo, sr_RS.po). Да бисмо могли на овај начин да користимо датотеке за локализацију, неопходно је омогућити локализацију у кôду.

load_theme_textdomain( 'radionica' );

Ради веће прегледности и боље организације, могуће је померити датотеке за локализацију у засебну фасциклу, најчешће languages. Да би ово функционисало неопходно је додати нову локацију у претходну функцију. Датотеке и овде задржавају само ознаку за локал у свом називу.

load_theme_textdomain( 'radionica', get_theme_file_path( '/languages' ) );

Комплетан код са радионице се може преузети са званичног налога Вордпрес Србија заједнице на Github-u.

У следећем термину се бавимо подршком теме за нови уређивач, познат под називом Гутенберг.

Радионице су бесплатне али је потребно пријавити се на Meetup групи Вордпрес Србија заједнице.

Нови Сад – 8 Радионица за израду Вордпрес тема, 19 јануар 2019

Прва радионица за израду Вордпрес тема у 2019 години је одржана у суботу, 19 јануара у новосадском Стартит Центру. У овом термину смо се посветили писању сигурнијег кôда помоћу тзв. escaping функција.

HTML

За једноставне стрингове који садрже само текст се користе esc_html() или esc_textarea(). PHP функција која овде обавља велики део филтрирања је htmlspecialchars().

Уколико очекујемо да стринг садржи и HTML ознаке онда можемо користити wp_kses_post() или wp_kses(). На овај начин ћемо обезбедити основно обликовање без бојазни да ћемо дозволити оне ознаке које могу пореметити распоред елемената на страници или чак направити неку већу штету.

Уколико не знамо шта можемо очекивати у стрингу а желимо да омогућимо обликовање као код садржаја или одломка чланка, можемо користити филтере за садржај, the_content, одн. oдломак, the_excerpt. Одломак ће вратити обликовање као и wp_kses_post() док садржај додаје и могућност правилног обликовања кратких кôдова (shortcode).

Атрибути

За филтрирање атрибута постоји посебна функција, ecs_attr(), која обавља потпуно исту обраду стринга као и esc_html().

URL

Уколико није дефинисан протокол, esc_url() ће га додати у облику “http://” на било који стринг који му је прослеђен. Подразумевани протоколи се могу пронаћи у wp_allowed_protocols(), где се, такође, могу додати и нови путем достпуног филтера.

Веома корисна функција за заштиту од нежељене поште је antispambot(). Она претвара сваки карактер е-поште у HTML ентитет и тиме сакрива од ботова присуство е-поште на страници.

Javascript

Пре свега је важно избегавати тзв “inline Javascript” колико год је то могуће. Уколико, ипак, постоји потреба за оваквом употребом скрипте, онда се препоручује филтрирање помоћу wp_json_encode() у комбинацији са esc_attr(), што се показало као много сигурнија опција од предвиђене esc_js() функције.

Уколико је потребно Javascript датотеци проследити одређене податке из PHP-a, може се користити функција wp_localize_script(). Иако је предвиђена да прослеђује стрингове спремне за локализацију, ова функција се у пракси користи и за прослеђивање свих осталих типова вредности (бројева, булеана итд) који се могу динамички користити у Javascript кôду.


Комплетан код са радионице се може преузети са званичног налога Вордпрес Србија заједнице на Github-u.

У следећем термину ћемо се упознати са функцијама за интернационализацију теме, припремићемо целу тему за локализацију и, уз помоћ Поедита (софтвера за превођење), направити датотеке помоћу којих се врши превод.

Радионице су бесплатне али је потребно пријавити се на Meetup групи Вордпрес Србија заједнице.

Нови Сад – 7 Радионица за израду Вордпрес тема, 22 децембар 2018

Последња радионица за израду Вордпрес тема у 2018 години је одржана у суботу, 22 децембра у новосадском Стартит Центру. У овом термину смо се посветили бочној траци, виджетима и различитим приказима архива.

Бочна трака

Као носиоца различитих виджета, бочну траку смо регистровали и додали у sidebar.php и позвали у index.php путем get_sidebar() функције. Како бисмо избегли празан HTML markup, као и празан простор на страници када ниједан виджет није додат у бочну траку, употребили смо is_active_sidebar() функцију за проверу постојања виджета и body_class копчу да додамо прилагођену класу за <body> ознаку.

Архиве

Вордпрес има велики потенцијал у пролагођавању архива различитим потребама веб места. Ми смо се посветили специфичностима неких од њих.

archives.php

Односи се на приказ свих архива и, уколико постоји у теми, преузима ову улогу од index.php шаблона. Приказ назива и описа архиве је поједностављен функцијама the_archive_title() и the_archive_description().

Уколико подразумевани назив и опис не одговарају потребама веб места, или не постоје и не могу се додати из контролне табле (као што је случај са описом архива датума), промена је веома једноставна употребом филтер копчи get_the_archive_title и get_the_archive_description.

date.php

Односи се на све архиве датума: година, месец и дан. Преузима улогу шаблона за архиве датума од archives.php или index.php шаблона, уколико archives.php шаблон не постоји у теми.

Уколико постоји потреба, могуће је раздвојити архиве датума на year.php, month.php и day.php ради даљег прилагођавања.

author.php

Односи се на архиве аутора и преузима улогу шаблона за архиве аутора од archives.php или index.php шаблона. Подразумевано су доступни додатни подаци аутора (аватар, биографија, сва поља из профила) а могуће је додатно персонализовати архиву употребом прилагођених изборника и сл.

search.php

Посебан вид архиве који приказује резултате претраге. Ово је згодно место за приказ формулара за претрагу путем get_search_form(), а такође су нам доступне и кључне речи претраге у функцији get_search_query().

Уколико је неопходно изменити HTML самог формулара за претрагу, то је могуће урадити у посебно делу шаблона searchform.php.

Bug

Обзиром да подразумевена претрага Вордпреса претражује кључне речи у пољима за наслов, садржај и одломак чланка и странице, нама се на архиви резултата претраге појавила PHP нотификација када је одломак празан у чланку. Ово је узроковано кодом из нашег прилагођеног изборника (лоциран у inc/class-custom-walker-nav-menu.php, линија 138). Ову линију смо померили унутар провере постојања одломка, на линију 155, и тиме је нотификација успешно уклоњена. Ову промену можете видети овде.


Комплетан код са радионице се може преузети са званичног налога Вордпрес Србија заједнице на Github-u.

У следећем термину се бавимо локализацијом и припремом теме за превођење, уз неминовно упознавање са функцијама за escaping различитих вредности.

Радионице су бесплатне али је потребно пријавити се на Meetup групи Вордпрес Србија заједнице.

Нови Сад – 6 Радионица за израду Вордпрес тема, 08 децембар 2018

У суботу, 8 децембра 2018 године у новосадском Стартит Центру је одржана шеста радионица за израду Вордпрес тема. Наставили смо са шаблоном појединачног чланка и завршили ову област, започету на петој радионици.

Коментари

За измену приказа листе коментара смо користили callback, и наишли на тзв bug у коду самог Вордпреса. Када се нађемо у оваквој ситуацији веома је корисно пријавити bug, прилагодити код тренутном стању и сачекати да исправак кода стигне у званичну верзију Вордпреса. Уколико знате и како да направите исправак, цео процес се значајно убрзава.

Пријавили грешку у коду и уједно доставили исправак (#45498). Сада можемо да чекамо верзију 5.1, за коју је предвиђено да садржи овај исправак.  

Образац за коментаре смо изменили на неколико начина. Који начин изабрати зависи искључиво од тога које су размере и природа промене. Уколико желимо у потпуности да изменимо HTML markup обрасца онда има смисла измене проследити као параметар comment_form() функције.

Уколико само желимо да изменимо места пољима или да искључимо поједина поља обрасца онда је сасвим довољно користити comment_form_fields филтер копчу.

Од осталих функција везаних за шаблон коментара, додали смо наслов секције у зависности од броја коментара, функцију за кретање коментара, the_comments_navigation() и обавештења за затворене коментаре или неопходну регистрацију и пријаву уколико је то подешено у контролној табли.

Облик чланка

Облик чланка је посебан вид издвајања појединих чланака према одређеним критеријумима који отвара могућност засебног шаблона за приказ чланка. Различити облици чланка су доступни путем подршке теме.

Прилагођен шаблон чланка

Од верзије 4.7 доступни су прилагођени шаблони за све врсте чланака, што је до тада било омогућено само за странице. Ова могућност употпуњује широку палету сценарија у којима се чланци могу приказивати на различите начине док се прилагођена врста чланка оставља за оне случајеве када је потребно ићи даље од визуелних разлика.


Комплетан код са радионице се може преузети са званичног налога Вордпрес Србија заједнице на Github-u.

У следећем термину ћемо се посветити виджетима и различитим приказима архива. Уједно, овим завршавамо основну обуку развијања тема а од јануара прелазимо на напредније теме. Локализација и припрема теме за превођење, подршка теме за нови уређивач (познат под кодним именом “Гутенберг”), прилагођена подешавања у прилагођавачу су само неке од области којима ћемо се бавити у 2019 години.

Радионице су бесплатне али је потребно пријавити се на Meetup групи Вордпрес Србија заједнице.

Нови Сад – 5 Радионица за израду Вордпрес тема, 24 новембар 2018

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

Прилагођени део шаблона

Како бисмо обезбедили прилагођен изглед и функционалност, а опет избегли превише кондиционала за различите приказе садржаја (страница, чланак на архивама и сл), део шаблона за приказ садржаја, entry.php, смо копирали и сачували као entry-post.php. Ово нам је дало могућност да позовемо entry-post.php у single.php на динамички начин:

get_template_part( '/template-parts/entry', get_post_type() );

Ово значи да ће entry-post.php бити учитан уколико се налазимо на типу чланка post. Међутим, уколико постоји тип чланка нпр. book а не постоји entry-book.php, када се нађемо на овом типу чланка видећемо да је учитан entry.php.

Мета

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

Датум је могуће форматирати на различите начине али се препоручује да се у коду не инсистира на одређеном формату јер сваки корисник у контролној табли има могућност прилагођавања формата свом језику. Формат смо дефинисали једино за потребе datetime атрибута јер се он користи у мапама сајта.

Обележавање страница и кретање (пагинација и навигација)

Појединачни чланак се може поделити на више страница, што се врши помоћу wp_link_pages() функције и додавања <!–nextpage–> ознаке у садржају. Такође, могуће је кретати се од једног до другог чланка директно са странице чланка помоћу the_post_navigation() функције.

Као и код сваке навигације, и овде имамо наслов који описује само кретање. Овај наслов је важан за све читаче екрана који се користе при асистивним технологијама. Уолико не желимо да се овај наслов види можемо га врло лако сакрити помоћу screen-reader-text класе при чему ће и даље бити доступан за читаче.

Коментари

За приказивање листе коментара, као и обрасца за коментаре, неопходно је додати comments.php део шаблона, а у шаблону single.php учитати коментаре путем comments_template() функције. Доступна је и поршка за HTML5 и за листу и за образац.

Функционалност коментара је доста комплексна и флексибилна. Постоји низ начина на које можемо прилагодити систем коментара, од Walker класе, преко callback функције, па све до читавог низа копчи (филтера и акција). Неке од ових начина смо испробали на радионици а неке ћемо проучити у следећем термину.


Комплетан код са радионице се може преузети са званичног налога Вордпрес Србија заједнице на Github-u.

У следећем термину ћемо наставити са прилагођавањем обрасца за коментаре, преосталим ознакама које се користе у comments.php шаблону, као и осталим начинима прилагођавања шаблона појединачног чланка.

Радионице су бесплатне али је потребно пријавити се на Meetup групи Вордпрес Србија заједнице.