Gutenberg е блок-редакторът на WordPress
Gutenberg е актуалният редактор на съдържание в WordPress, наричан още блок-редактор. Има възможност за добавяне на допълнителни плъгини, които го превръщат в много сериозен конкурент на популярните програми за създаване на сайтове (Page Builders).
В различни публикации може да срещнете термините plugins, add-ons и extensions (плъгини, добавки и разширения), но те всички означават едно и също нещо – интегриране на допълнителни функционалности в интерфейса на блок-редактора и може да се използват на заменяем принцип.
Важно е да се отбележи, че различните Gutenberg плъгини предлагат в голяма степен идентични блокове (напр. Заглавия, Изображения…) и реалната разлика е в опциите, които съответният плъгин поддържа. Затова може да се каже, че най-полезни са плъгините, които предлагат най-голям брой блокове за създаване на персонализирано съдържание в WordPress.
В статията ще Ви представим един от най-популярните плъгини за Gutenberg – Getwid. Getwid е създаден от разработчиците на Motopress (https://motopress.com/), компания с доказано присъствие в елита на WordPress общността. Плъгинът предоставя достъп до впечатляваща колекция от блокове (40+), които предлагат интуитивен контрол при създаване и форматиране на съдържание, лесни и адаптивни настройки.
Потребителите могат да избират между богат набор от съдържателни блокове като плъзгачи (carousel, slider) за медии, текст и изображения, икони, бутони, секции, банери, галерии, панели за ценови списъци, отзиви на клиенти, блокове за Instagram, MailChimp, Google Maps, броячи, идентификатори за процеси, ценови таблици, времеви линии, персонализирани типове съдържание и много други.
Getwid Base – безплатна многофункционална WordPress Gutenberg тема
За да бъде пълно удовлетворението на WordPress феновете, разработчиците от Motopress предоставят свободно достъпната многофункционална WordPress Gutenberg тема Getwid Base за лични и бизнес уебсайтове от всякакъв мащаб.
Това е официалната стартова тема за плъгина Getwid, в която с кликане на няколко бутона можете да инсталирате професионално създадените Gutenberg блокове.
Благодарение на комбинацията от Gutenberg блокове и библиотека от шаблони (Template Library), която се активира през плъгинa Getwid, може да се създават и персонализират страници, богати на съдържание, без необходимост от умения за работа с код.
Ако нямате специални изисквания към дизайна, структурата и функциите на сайта, само със замяна на графиката, цветовата гама и текста може да бъде публикуван на наш собствен сайт (персонален, бизнес, start-up, landing page, портфолио, блог…) на базата на Getwid в рамките не на седмици и дни, а на часове.
Инсталиране на тема Getwid Base
Инсталирането на темата Getwid Base се извършва чрез въвеждане на getwid в полето за търсене в Dashboard » Appearance » Themes » Add New, след което е нужно да се последват бутоните Install и същия бутон, вече с етикет Activate.
Друг начин за инсталиране на темата е, като я изтеглете от https://wordpress.org/themes/getwid-base/ и инсталирайте темата през бутона Upload Theme.
Инсталиране на Getwid плъгин и импортиране на примерно съдържание
След успешната инсталация ще откриете съобщение за препоръчително инсталиране на два плъгина – Getwid и One Click Demo Import, затова кликнете на линка Begin installing plugins.
Маркирайте двата плъгина и ги инсталирайте.
След това ги маркирайте и ги активирайте.
За стартиране на импортирането отидете на Appearance » Import Demo Data.
По време на импортирането съществуващо съдържание – публикации, страници, категории, изображения, персонализирани типове публикации или други данни няма да бъде изтрито или модифицирано. Ще бъдат импортирани допълнително само публикации, страници, изображения, джаджи, менюта и други настройки на темата.
След импортиране на съдържанието, трябва да се конфигурира ръчно формуляра за контакти и API ключовете за свързване с приложения като Google Maps, Instagram, MailChimp, YouTube…
Необходимо е изчакване на завършване на процесът без да се затварят екрана и без да се клика на линкове в менюто. След получаване на потвърждение, че процесът на импортиране е завършен с грешка.
Всъщност това не е типична грешка, а от съображения за сигурност WordPress не позволява импортиране на оригиналното лого в SVG формат.
Ако желаете да имаме оригиналното лого в нашата инсталация на Getwid Base може да запазите файла на компютъра си от URL https://getwid.getmotopress.com/wp-content/uploads/2019/04/logo1.svg.
и да ползвате безплатен онлайн конвертор https://svgtopng.com/, за да го конвертирате в PNG формат.
След което го качвате в Media Library.
През Customizer » Site Identity » Logo избирате файла и кликате бутона Publish.
Вече имате пълната инсталация на темата Getwid Base заедно с всички Getwid Gutenberg блокове, които може да разгледате директно на сайта през линковете Blocks 01, Blocks 02 и Blocks 03 в хоризонталното меню.
Getwid – блокове за Gutenberg
Разширението за Gutenberg блокове Getwid може да бъде разглеждано като приложение две в едно: пакет от многофункционални WordPress блокове за Gutenberg и библиотека за шаблони (Template Library).
Плъгинът дава достъп до много опции за персонализиране за всеки блок: контролиране на оформлението, типографията, цветовете, иконографията, медиите, анимацията и други, за да се създадат лесно персонализирани уебсайтове от всякакъв мащаб.
Поддържайки най-добрите практики за кодиране, Getwid постига оптимизирана структура и бързина на зареждане дори на сайтове с множество персонализирани блокове.
Кратко описание на Getwid блокове за Gutenberg
За да достъпите Getwid Blocks отворете страница или публикация в WordPress и натиснете иконата със символ знак плюс + и в панела изберете Getwid Blocks.
Ще Ви покажем наличните Getwid блокове към момента на публикуване с кратко описание на всеки един блок, следвайки подреждането в Gutenberg.
Първият блок е библиотеката за шаблони Template Library, която може да достъпите директно и през линк със същото име в хоризонталната лента с инструменти.
В новия панел натиснете бутона Insert Template, за да се отвори библиотеката с шаблоните.
За да откриете по-лесно подходящ шаблон, може да ползвате падащото меню All Categories или да ползвате полето за търсене.
При посочване на шаблон се активира бутон Insert Template, който при кликане импортира шаблона в съответната страница или публикация.
Section (секция, основен структурен елемент в страница или публикация) – изграждане на персонализирани оформления от всякакъв тип (задаване на колони и подравнения; видео презентации и фон, плъзгащи блокове с текст и изображения; промяна на фон, прилагане на анимация, управление на карти с текстове, цветове и изображения…).
Media & Text Slider (плъзгащи текстове и медийни файлове) – привличане вниманието на посетителите с плъзгащи се текстове, задаване на персонализирана ширина и подравняване на съдържание, прилагане на текстови и цветни слоеве (overlays), прилагане на слайд ефекти и анимация на текст.
Image Slider (плъзгащи се изображения) – блок за създаване на плъзгащи се изображения с пълен контрол върху навигационните стилове, размерите на изображенията и анимационните ефекти.
Icon (икони) – създаване на ефектни и ясни потребителски интерфейси с колекция от персонализирани икони.
Icon Box (области с икони) – създаване на адаптивни полета за услуги с икони, заглавия и текст, с използване на предварително изработени стилове, промяна на цветове, размери и ефекти при посочване с мишката (hover effects).
Banner (банери) – рекламни блокове с напълно адаптивни банери, за които дефинираме шрифтове, размери, подравнявания, цветове, анимационни ефекти и бутони за по-добро представяне на нашите продукти, услуги и проекти.
Tabs (раздели) – хоризонтални раздели с множество предварително зададени стилове и персонализирани заглавия.
Accordion (акордеон) – секция за показване на скрито съдържание при кликане на заглавие, функционален акордеон с персонализирани икони и типове заглавия, перфектния блок за създаване на секции с често задавани въпроси.
Toggle (превключване) – наподобява много работата на блок Акордеон, но позволява на потребителите да разширяват и скриват съдържанието на отделен панел независимо от другите панели в блока, докато при Акордеон отварянето на нов панел затваря предишния отворен панел.
Image Stack Gallery (застъпване на изображения в галерия) – разчупено и адаптивно подреждане на изображения в галерии със седем различни стила, дава възможност за бягство от традиционната решетъчна структура на галериите и създаване на ефектен дизайн.
Google Maps (google карти) – блок за вграждане на опростени карти Google Maps с неограничени персонализирани маркери.
Recent Posts (последни публикации) – може да представите най-новите си публикации с персонализирани мета данни, оформени като списък или решетка.
Advanced Heading (разширени настройки на заглавие) – богат контролен панел за типография за създаване на заглавия – пълен достъп до Google Fonts и настройките за шрифтове, стилове и размер на текста, преобразуване на текстови букви с едно кликане, дефиниране на разстояния и цветове.
Image Box (настройки на изображение) – предоставя достъп до настройки за по-атрактивно представяне на изображения – може да добавите анимационни ефекти, да приложите динамично оразмеряване и промяна на разстоянията около изображенията.
Advanced Spacer (настройване на разстояние) – позволява да добавите интервал между блоковете с динамично регулируеми настройки – по желание може да бъде скрит или да следва адаптивни настройки на мобилни устройства, таблети или десктоп компютри.
Social Links (социални връзки) – улеснява добавянето на различни социални икони, може да се персонализира подравняването за различни устройства, като се следва предварително създадени оформления, възможна промяна на техния размер и разстоянията около тях.
Button Group (група бутони) – дава възможност за добавяне на няколко стилизирани бутона с подкана за действие (call-to-action), като може да се настроят ширината, подравняването и посоката за целия набор от бутони едновременно.
Testimonial (отзиви на клиенти) – блок за свидетелства на клиенти с аватар (анимирано или реално изображение) на автора, име, длъжност и текст.
Person (профил на личност) – за създаване на впечатляващо представяне на всяка личност от колектива в отделен панел с изображение, връзки към акаунти в социални мрежи, име, позиция и кратко представяне.
Instagram – свързване на WordPress със собствен акаунт в Instagram и създаване на персонализирана галерия.
Progress Bar (хоризонтална лента за развитие на процес) – анимирана хоризонтална лента за развитие на процес с настройки за стойност и цветове.
Circular Progress Bar (кръгла лента за развитие на процес) – анимирана кръгла лента за развитие на процес с настройки за ширина, стойност и цветове.
Counter (брояч) – показва цифрови данни за нашия бизнес като брои от нула до определената стойност за определено от нас време в секунди.
Price Box (таблици за цени) – подходящ блок за визуализиране на данни; може да се създават различни таблици за параметри и цени (например сравнение на хостинг планове).
Contact Form (формуляр за контакт) – формуляр за контакт с традиционен набор от полета за въвеждане на данни, персонализирани етикети и поддръжка на reCAPTCHA.
Post Carousel (последователно показване на публикации) – имате достъп до опции за персонализиране, за да покажете публикации, страници или персонализирани типове съдържание чрез кликане върху индикатори или през определен интервал от време.
Post Slider (плъзгане на публикации) – помага да визуализираме съществуващите публикации, продукти или други персонализирани типове публикации в настройващ се slider с няколко предварително подготвени оформления.
Custom Post Type (персонализиран тип съдържание) – блокът предоставя множество настройки за избор между оформление в стил решетка, списък или персонализиран изглед на всички custom post type публикации.
Price List (списък с цени) – перфектен блок за представяне на цени от меню на ресторант или съдържание с регулируеми заглавия, пунктирани линии, цветове и изображения.
Mailchimp – лесна интеграция с API на MailChimp за добавяне на формуляри за абонамент.
Video Popup (изскачащ прозорец за видео) – показване на нашите Youtube, Vimeo или самостоятелно хоствани видео клипове в изскачащи прозорци; бутона за видео възпроизвеждане, персонализираните заместващи изображения, цветовете и размерите на контейнерите са напълно регулируеми.
Image Hotspot (горещи точки в изображение) – чрез поставяне на неограничени анимирани маркери с напълно адаптивни подсказки (tooltips) върху изображение придава на публикацията интерактивен и впечатляващ стил.
Countdown (блок за обратно броене) – динамичен таймер за обратно отброяване с настройващи се цифрови стойности и времеви етикети, за които можете да зададете шрифт, размери, цветове, интервал.
Content Timeline (времева линия на съдържанието) – блокът показва в хронологичен ред всички събития в стилна графика на времевата линия с регулируеми контейнери като заглавия, подзаглавия, изображения.
Бележка: За да свържете с акаунти на трети страни трябва да активирате достъпа в секцията Getwid Settings, която достъпвате като изберете в главното меню Settings » Writing и въведете в съответните полета API ключове за следните услуги: Instagram Access Token, Google Maps API Key, Recaptcha Site Key, Recaptcha Secret Key, Mailchimp API Key.
