Съдържание
Доста често срещаните заявки са свързани със скриване на определени части от уебсайта, които нямат собствен бутон за включване/изключване от страна на администратора. Тъй като не е възможно да има бутони за администратора на темата за всеки детайл във фронтенда, можете просто да скриете нежеланите части с помощта на CSS, ако не сте запознати с редактирането на HTML кодове, за да премахнете частта изобщо.
Намерете частта за отстраняване
Можете да използвате инструментите за разработчици на браузъри, за да откриете точната част, която искате да премахнете.
Да речем, че искате да премахнете частта с датата и автора под публикацията в блога, като щракнете с десния бутон на мишката върху тази част Inspect Element и отворите инструментите за разработчици на браузъра:
Придвижвайки курсора на мишката върху изходния код, можете да видите маркиран раздел на страницата, който се отнася до ред от изходния код под курсора на мишката:
По този начин можете да откриете частта, която искате да скриете - например, като се позовавате на снимките по-горе, дали това са всички раздели с дата и автор, или само раздел с дата, или само раздел с автор.
Напишете CSS, за да скриете избрания раздел
Когато изберете част, която искате да скриете, използвайте атрибута ID или CLASS на избрания HTML таг в собствените си CSS стилове или използвайте точния CSS селектор, използван от темата за този таг. CSS селекторът за избрания таг, използван от темата, можете да намерите в дясната страна на инструментите за разработчици на браузъра.
Например, ако сте решили да премахнете цялата част с датата и автора, селекторът, използван от темата, е: .elm-posts-main .item .item-info
CSS стилът за скриване на HTML тага отстрани е "display: none;", можете да използвате и !important за да се предотврати по-нататъшно презаписване на CSS стила с друг CSS.
Така че окончателният CSS стил за скриване на частта с датата и автора ще бъде:
.elm-posts-main .item .item-info {
display: none !important;
}
Добавяне на персонализиран CSS код в Customizer
Можете да добавите персонализирания CSS код в Външен вид > Персонализиране > Допълнителни CSS
След като го публикувате, можете да го проверите на уебсайта си:
