Търсачката на WordPress е гадна
Не познавам никого, който използва WordPress и говори добре за търсачката му, и все още не разбирам, че тя почти не се е развила от първите версии.
Той не само е примитивен в работата си, но и не предлага никаква конфигурация. Дори външният вид на страницата с резултати оставя много за желаене. В зависимост от шаблона, който използвате, тя може да има малко по-добър дизайн, но като цяло все още е праисторическа.
Външният вид на резултатите може да бъде подобрен малко с CSS, а отговорът - с безплатна приставка (с платена версия) като Relevanssi (въпреки че тя ще утрои теглото на вашата база данни) или тази, която се свързва с външната услуга на Algolia (безплатно до 10 000 заявки за търсене на месец).
Но ще оставя въпроса за производителността за друг ден, тъй като все още се боря с него и се занимавам с чисто естетическите реформи, използвайки GeneratePress (GP) и GenerateBlocks (GB).
GeneratePress и GenerateBlocks
GP и GB все още са два инструмента от млад проект с много възможности за използване, които трябва да се подобрят, GB не предлага същата крива на обучение, каквато може да очаквате, ако идвате от използването на строители като Elementor или подобни.
Както ще видим в този пример, някои процеси за изграждане на определени неща с GenerateBlocks са много по-дълги и трудоемки и могат да бъдат малко отчайващи при първите опити. С добавянето на все повече и повече блокове нещата се усложняват.
В замяна на това, когато разберете как работят те и се сдобиете с тях, имате много по-голям контрол върху начина, по който изглежда всеки елемент.
Трудността се балансира от документацията и безупречната поддръжка, в която създателите му дори подават ръка за специфични въпроси, свързани с дизайна, които не са в тяхната компетентност, така че това все пак е алтернатива, която трябва да се вземе под внимание, тъй като те остават верни на своята философия; справедлив, чист и лек код.
Елементи на блока
Елементите на блокове, наричани по-долу Елементи, бяха добавени през юли 2020 г. във версия 1.11.0 на GeneratePress Premium. Той може да се използва като обикновена кука за вмъкване на съдържание почти навсякъде в блога ви, без да се налага да се занимавате с код.
Когато се комбинира с GenerateBlocks, тя ви позволява да използвате редактора на блокове на WordPress за създаване на куки, заглавия, долни колонтитули, странични ленти, страница "Герой", шаблони за съдържание и др.
По същество.
Шаблон на структурата
Първото нещо, което ще направим, е да създадем нещо, което ще наречем "шаблон на структура". Тази стъпка не е задължителна, но е добре да създадем такъв, в случай че искаме да променим нещо с няколко кликвания.
Давам му това име, защото той ще определи само структурните аспекти, но не и съдържанието му. Тоест, ако искаме да покажем или не заглавието, долния колонтитул или неговите уиджети, странична лента или да определим ширината и т.н., и така да не се занимаваме с имената на блоковете от останалите стъпки.
От главното меню "Външен вид/Елементи" или от горната част можете да получите достъп до създаването и управлението на елементите.
За конкретната употреба, която разглеждаме тук, при добавянето на нов елемент избираме Design (Дизайн) и натискаме create (Създаване).
След това указваме на елемента на коя страница да се прилага. За да направим това, преминаваме към раздела "Правила за показване" и в позицията избираме "Резултати от търсене" от падащото меню.
Елементите предлагат много възможности за персонализиране. Както ще видите, в този падащ списък можете да изберете повечето позиции на блога си, така че тези настройки да бъдат приложени там.
Можем също така да решим кои елементи искаме да скрием. В моя случай ще използвам само една опция, за да се справя без страничната лента, затова избирам"Съдържание (без странични ленти)".
Съществуват и други начини за скриване на страничната лента, но този, освен че е най-лесният и бърз, ни позволява да върнем всяка промяна, като просто се върнем тук или директно "отменим публикуването" на този елемент/шаблон в състояние "Чернова", като по този начин върнем страницата към първоначалния ѝ вид.
Освен това разделът "Деактивиране на елементи" ви позволява да оставите страницата практически чиста. Може да се каже, че това е еквивалент на шаблона за страница "Canvas" на Elementor, само че леко подобрен и по-прост за използване.
Най-добрата практика, която се препоръчва и в един от разделите за конфигуриране, е да се документира какво прави всеки елемент с вътрешни бележки, в случай че заглавието не е достатъчно описателно или не искаме да е твърде дълго.
Свикнах да добавям бележки и коментари към всичко, защото когато правите много промени и с течение на времето е неизбежно да забравите къде и/или как са направени. Така че във вътрешните бележки винаги ще имате цялата информация, от която се нуждаете, за да проследите стъпките си, ако нещо се обърка или ако искате да направите нови модификации.
С публикуването на този шаблон вече ще имаме конфигурирана по наш вкус страница с резултати, но, разбира се, сега тя ще бъде празна, когато се извърши търсене, защото трябва да създадем и публикуваме нов елемент, който ще определя външния вид на тези търсения.
Можете да оставите този шаблон в работен вариант за момента, докато го направим, и да го публикувате, когато всичко е готово.
Шаблон на външния вид
Въпреки че това е просто още един елемент, аз го наричам "шаблон за външен вид" за това малко ръководство, защото по това време бях малко объркан от номенклатурата на всяко нещо и различните възможности за използването му.
Тук започва истинската работа по персонализирането.
Създаваме нов елемент, този път Блок, и му даваме описателно име.
Добавяме контейнер GenerateBlocks и в него поставяме блок "Query Loop".
Ето какво ще видим.
Избрах"Начало празно", за да възпроизведа естествената структура на резултатите, но можете да изберете някой от шаблоните, предлагани в този блок.
Най-добре е да ги изпробвате, преди да вземете решение, тъй като след като започнете работа по един от тях, няма да можете да приложите друг и ще трябва да започнете целия процес отначало, ако искате да го промените (нещо, което GB трябва да реши).
След като изберете шаблона, изберете блока с цикли на заявката (1) и ще видите раздела "Блок" вдясно (2). Щракнете върху него и поставете отметка на опцията"Inherit query from template" (Наследи заявка от шаблона) (3) в раздела "Query parameters" (Параметри на заявката). Накрая, в долната част, под "Правила за показване"/"Позиция" (4) търсим и задаваме "Резултати от търсенето" и запазваме като чернова.
Когато разгърнем цикъла на заявката, ще видим това:
Добавете още един блок на решетката под "Шаблон на заявката" и изберете желаната структура.
В примера ще използваме един от двата контейнера , които ще действат като колони. Лявата колона ще бъде мястото за водещото изображение, а дясната колона ще показва откъса от записа (excerpt).
Можете също така да играете с три контейнера и да конфигурирате централния като пространство. Настоявам, че възможностите са много и най-добре е да си поиграете с тях.
Както може би сте забелязали, ние изграждаме почти от нулата контейнер с всички части, които ще съставляват крайния вид на това, което искаме да покажем. В този случай резултатите от търсенето, но това може да се направи с всяко друго съдържание.
Сега атакуваме тези два контейнера.
Избираме първия контейнер и задаваме ширината му на 33 (която всъщност е 33,33), както ще видите, ако превъртите надолу към опциите за промяна на размера.
Правим същото и с втория контейнер и избираме 66 (който автоматично ще бъде зададен като 66.66). Очевидно най-важното е всички използвани контейнери да се сумират до 100, така че да не излизат извън хоризонталното пространство на страницата и да се показват на един и същи ред.
Сега, след като е избран първият контейнер, добавяме в него блок с изображения GenerateBlocks.
Тогава ще се появят различни пространства за изображения. Не се паникьосвайте, това е така, защото блокът открива цикъла и пресъздава неговото поведение. Ако търсачката ви покаже десет резултата, това са пространствата, които ще се появят. Просто продължете да работите върху контейнера с изображения, като подминете голяма част от останалото, което не е нищо повече от предварителен преглед на страницата с резултатите.
Изберете отново контейнера, съдържащ изображението (1). В менюто на блока вдясно слизаме до "Активиране на динамични данни" и го активираме (2). Избираме "Featured image" (Препоръчано изображение) в "Background image source" (Източник на фоново изображение) (3) и изображенията ще се появят в редактора.
В източника на връзка избираме "Индивидуална връзка" (4), така че всяко изображение да се свързва със съответната публикация, и отново го запазваме като чернова.
Сега отиваме във втория контейнер, избираме го и добавяме блок "Headline" от GenerateBlocks.
Изберете блока "Заглавие" (1) с активирани динамични данни (2) и повторете предишния процес (3), но този път изберете "Заглавие" като източник на съдържанието (4) и отделен запис в източника на връзката (5).
Накрая ще добавим още един блок "Title" по-долу, който ще се използва за показване на откъса от записа, като следвате тези стъпки.
След като бъде добавен, повторете същия процес отново. С избрания нов блок (1) активираме динамичните данни (2) и като източник на данни (3) текущия запис и източника на съдържание "Извлечение" (4). Сега можете да зададете и дължината на извлечението в думи (5).
Накрая ще добавим странирането, което ще се появи под резултатите. За да направите това, изберете блока с цикъла на заявката (1) и щракнете върху малкия символ + с точките, който ще намерите в лентата за редактиране (2).
Страницата е изградена с блок от бутони, на които трябва да придадете формат, цвят и форма, които отговарят на търсения от вас вид. Всички възможни конфигурации, които не са малко, се намират в менюто на блока, където винаги ще имате на разположение опции за фина настройка на всеки блок за мобилни устройства, таблети и настолни компютри.
Ще го оставя тук, за да не удължавам твърде много този пост.
Съветвам ви да направите всичко това първо в тестова среда, за да видите как наистина работи отвъд предварителния преглед, предоставен от редактора, и да го публикувате, когато сте сигурни, че се показва както трябва.
Не забравяйте също, че ако сте направили този блок за проектиране, който беше предложен в началото и който нарекохме Шаблон на структурата, който оставихме в проект, ще трябва да го публикувате.
Това е отправна точка за по-нататъшно персонализиране на външния вид на страницата с резултати в зависимост от естетическите ви предпочитания.
Много възможности за персонализация
Можете да продължите да добавяте или редактирате каквото пожелаете, например блок с два контейнера между заглавието и откъса и да добавите там датата на публикуване, името на автора на записа или каквото пожелаете.
Ако сте готови за това, можете дори да създадете друг шаблон за тази безвкусна страница по подразбиране, когато WordPress не намира резултати при търсене, и да добавите информационни полета или друг елемент, който ще помогне на посетителя да намери това, което може би търси.
Можете да променяте вида и размера на шрифта, да го оправдавате на една или друга страна, да регулирате разстоянието и размерите на елементите, да си играете с цвета на фона, като добавяте изображения и форми, да добавяте икони, рамки, ефекти на преминаване върху връзките, сенки върху контейнерите и т.н.
И всичко това, без да напускате редактора и без да се налага да се занимавате с CSS или да пипате файловете на шаблона.
Тук можете да изпробвате основното оформление на моите резултати от търсенето, за което все още трябва да доусъвършенствам някои неща, като например да добавя времето за четене и броя на посещенията, да напиша празните откъси и да добавя липсващите изображения.
Бонус топка: Ако трябва да добавите типичната фраза"Showing (number) results for: ( searchword)" към резултатите, тук можете да намерите необходимия код и инструкции за работа с блока Query Loop, благодарение на Дейвид от поддръжката на GB.
