Окремі CSS для кожного допису? Легко!

Чи хотіли ви коли-небудь блог з таким дизайном, щоб кожний новий допис був оформлений у іншому стилі? При чому, ці стилі ви могли б вибирати у процесі написання статті?

Насправді це дуже легко зробити вже зараз. Просто у вашому WordPress-блозі! І зараз я розповім як 🙂

Для початку напишемо невеличкий шматок коду, що буде встановлювати стилі на сторінку допису. Ось він:



ID, 'post-css', true); ?> 




Для більшого розуміння того, що ми пишемо, коротко розглянемо теги, що їх ми застосували тут.

  • У першій стрічці в операторі if через тег is_single() задано умову виконання нашого коду, а саме: “Якщо будь-яка сторінка з дописом (Post page) буде відображена..”. Це означає, що даний код буде діяти лише на одиночній сторінці із дописом.

  • У другій стрічці оператор циклу while задає час виконання (по іншому це можна зрозуміти так: “виконувати поки..”), а вордпресівський цикл (великий The Loop) і є тим часом та означає, що код виконуватиметься коли двигунець виводить допис.

  • У третій стрічці використовується функція get_post_meta, що повертає значення власного поля, що ми потім введемо. У дужках наведено параметри функції. Перший параметр визначає ID допису, другий додає назву власного поля (у нашому випадку це post-css), третій – у нашому випадку значення true означає, що значення (value) власного поля (custom fields) передаватиметься як єдиний результат (string), а не масивом. У цій же стрічці перемінній newcss присвоюється значення, що отримає функція get_post_meta.

  • У п’ятій стрічці відбувається виведення значення перемінної newcss. Значення буде виведена поміж тегів стилів (четверта і шоста стрічки відповідно). Вже можна здогадатись, що потрібно вписувати у поле значення (value) власного поля (custom fields). :biggrin:

  • Код у решті стрічок це закінчення циклу WordPress. Ніц цікавого, але все так має бути. 😉

Вищеописаний код слід встановити одразу після стрічки з оголошенням ваших CSS стилів. Залишилось лише створити власне поле під назвою post-css та його значенням приблизно такого змісту:

body { background:#333333 !important; }

Це лиш приклад стилів. Ви вправі і навіть повинні замінити їх на свої! Все обмежується лише вашою фантазією (головне, щоб не можливостями! :silly: )!

Натхнення для статті було ось тут. Бажаєте доповнити статтю? Будь-ласка, пишіть свій коментар!

За підтримки:
Размещения серверного и коммутационного оборудования собственного или в аренду. Центр обработки данных.

Фотоомоложение, пилинг, удаление морщин. “Оксфорд Медикал”

Море, море…

Море, море…

Небо є #00BFFF, а земля – #8B4513

Небо є #00BFFF, а земля – #8B4513

Новіший допис

There are 2 comments

    1. Psiho

      Так, ти абсолютно правий. І якраз метою цієї та подібних статтей є розкриття цих можливостей. Тож писатиму ще! 🙂

Надіслати коментар