≡×МЕНЮ

• Поради
• Програми
• Огляди
• Рейтинги
• Ігри

Додавання піктограм пунктів меню Joomla. Простий і добрий способи. Організація контенту в Joomla — видалення та створення статей в адмінці, а також налаштування параметрів для всіх матеріалів Для початку створимо дані для прикладу

Привіт читачам)

У цій статті ми розглянемо вставку соц-іконок на Ваш Joomla-сайт.

Соціальні іконки потрібні для того, щоб користувач міг поділитися вашою статтею або посиланням на сайт через соціальні мережі.

Для початку давайте зайдемо на сайт share42.com/ru.

Даний сайт дозволяє згенерувати скрипт та зовнішній вигляд іконок.

Крок 1 - Вибрати розмір та відзначити потрібні іконки:

Вибираємо розмір іконок (32x32, 24x24, 16x16 пікселів). За замовчуванням коштує 32х32 px.

Вибираємо потрібні нам мережі (просто натискаємо на значки, можна перетягувати, щоб виставити потрібний порядок)

Крок 2 - Налаштування:

• вибираємо тип панелі з іконками: горизонтальна, вертикальна (плаваюча);
• обмежуємо кількість видимих ​​іконок (доступно при виборі типу – вертикальна);
• кодування сайту, для joomlaце UTF-8;
• додавати або не додавати іконку сайту share42 (на Ваш розсуд);
• посилання на RSS, доступне, якщо раніше було відзначено іконку RSS;
• включення JQuery, що ставиться для лічильника публікацій;
• Після виконаних дій ми можемо подивитися на прикладі, як виглядатиме наш блок іконок та завантажити готовий скрипт.

Наступні – це встановлення скрипту на Ваш сайт.

Після того, як скачали архів зі скриптом, потрібно розархівувати папку share42 в корінь сайту.

У пункті №4 - "Виберіть найбільш підходящий тип сайту" вибираємо "Будь-який сайт".

Тепер копіюємо код:

Замість site.name вказуємо домен вашого сайту. І вставляємо його у вихідний код шаблону або модуль типу "HTML".

Для оформлення панелі іконок використовуємо запропонований css-код:

#share42 (padding: 6px 6px 0; background: #FFF; border: 1px solid #E9E9E9; border-radius: 4px;)

#share42:hover (background: #F6F6F6; border: 1px solid #D4D4D4; box-shadow: 0 0 5px #DDD;)

#share42 a (opacity: 0.5)

#share42:hover a (opacity: 0.7)

#share42 a:hover (opacity: 1)

Його вставляємо у будь-який css-файл Вашого сайту.

Додаткові параметри для налаштування:

Параметр	Опис	Приклад використання
	заголовок сторінки
data-description	опис до сторінки
	шлях до папки з файлом іконок icons.png
Параметри для вертикальної панелі
	відстань від початку сторінки до панелі, у пікселях
	відстань від верху видимої області сторінки до панелі, у пікселях
	зміщення панелі по горизонталі, в пікселях (негативне значення – вліво, позитивне значення – вправо)

Ось приблизно так має вийде:

На цьому все, Удачі)

PS Якщо щось не зрозуміло, пишіть коментарі.

Здрастуйте, шановні читачі блогу сайт. Сьогодні ми продовжимо серію уроків з Joomla.

Тема сьогоднішньої публікації – це організація, представлення та керування вмістом сайту (контентом). Ще ми докладно розглянемо нюанси видалення розділів, категорій та матеріалів, а також детально вивчимо можливі параметри, які можна зробити при додаванні нового матеріалу.

Структура та ієрархія контенту в Joomla

Організація та виведення контенту на сторінки проекту здійснюється за допомогою компонентів, які є . Для роботи зі статтями використовується вбудований компонент роботи з контентом. Правда, доступ до його налаштувань дещо відрізняється від звичайного і для цього вам потрібно буде вибрати з верхнього меню не пункт «Компоненти», а пункт «Матеріали».

Він дозволяє організовувати статті до розділів та категорій або залишати їх не класифікованими. У Joomla є також інші компоненти, які здатні виводити свій контент на сторінки сайту.

Це, наприклад, вбудований за промовчанням компонент контактів або виведення списку веб-посилань. Також можна використовувати сторонні розширення, наприклад, який використовується для організації різноманітних фотогалерей. За наведеним посиланням ви знайдете докладну публікацію цього захоплюючого процесу.

Виведення контенту так само можливе і за допомогою модулів, які виводять свій вміст по периферії основної частини сторінки. У цій статті ми докладно розглянемо способи виведення за допомогою вбудованого компонента для роботи зі статтями.

Тексти статей зберігаються у базі даних, а чи не в папках на жорсткому диску хостингу. Така організація дозволяє дуже швидко реорганізовувати контент у Джумлі. Замість переміщення файлів з текстами з одного каталогу до іншого, достатньо встановити нові атрибути для статті і вона миттєво буде віднесена вже до іншого розділу та категорії.

Як я вже згадував раніше, у CMS не зберігаються сторінки у вигляді файлів з розширенням ".HTML", як це здійснювалося раніше у статичних сайтах. Joomla генерує вебсторінку в момент клацання за посиланням, що дозволяє легко модифікувати документи, що переглядаються за рахунок зміни посилань в меню. Саме інформаційне наповнення залишиться незмінним.

У найпростішому випадку за посиланням з меню може відкритися одна стаття зі складу тих, що ви вже додали в . Але так само можна буде організувати висновок на веб-сторінку вмісту цілої категорії або розділу (переліку всіх матеріалів, що містяться в них, у тому чи іншому вигляді).

І в цьому випадку вам теж достатньо буде лише перейти на посилання з меню. Налаштувати, що саме буде виводитися при натисканні на посилання в меню, ви зможете в адмінці, вибравши потрібний вам варіант. Але про це ми поговоримо трохи згодом.

Найпростіший спосіб організації контенту – це використання не класифікованих статей, які не належатимуть жодним розділам та категоріям. Цей спосіб може бути актуальним та затребуваним при створенні сайту візитки на Джумлі, наприклад, коли ієрархічна організація буде просто зайвою і не потрібною.

При цьому на кожне посилання меню можна буде повісити окрему статтю шляхом створення в адмінці пунктів під назвою "Стандартний шаблон матеріалу". І тут ви витратите мінімальну кількість часу створення сайту, т.к. вам не доведеться розбиратися з усіма тонкощами та способами виведення. Вам достатньо буде написати кілька статей та повісити кожну з них на посилання у меню. Все – можна вважати, що візитівку створено.

Але це буде зручно та актуально лише в тому випадку, якщо статей буде не більше десятка. А якщо їх буде більше, і ви плануєте їх додавати з часом, то без ієрархічної організації контенту вже не обійтися. Для цих цілей служать розділи та категорії (двохрівнева ієрархія), за якими можна буде розкидати як уже існуючі матеріали, так і ті, які додаватимуться з часом.

Верхній рівень ієрархії — розділи, які безпосередньо не можна буде розмістити вміст (матеріали). Для розміщення статей служать категорії, які у свою чергу повинні обов'язково належати якомусь розділу. Простіше кажучи, розділи містять у собі лише категорії, а ось уже категорії містять у собі статті (контент).

Ієрархія виглядатиме приблизно так:

Оптимальним буде варіант, коли ви заздалегідь продумаєте структуру розділів та вкладених у них категорій. Так буде набагато простіше, ніж потім переносити купу матеріалів між ними. Схему вкладеності я вже досить докладно розглядав, тому не буду повторювати. Там же розповідав і про їх створення та налаштування.

Зараз хочу зупинитися на самому процесі наповнення сайту контентом. Тут начебто все просто – набивай тексти у візуальному редакторі, вставляй картинки та зберігай результат. Але спочатку можуть зустрітися невеликі складності та нерозуміння того, як зробити ту чи іншу дію. Все-таки Джумла має не повністю інтуїтивно зрозумілий інтерфейс, а значить і для мене знайдеться робота.

Видалення розділів, категорій та матеріалів в адмінці

Але перед тим, як навчатись створювати контент, пропоную вам навчитися його правильно видаляти. Тут знову ж таки немає нічого хитрого та складного, але є нюанси, які можуть при цьому виникнути. Вміст у вас може опинитися на новому проекті з тієї причини, що при движку ви, наприклад, не зняли галочку, яка наказує додавання демо-даних.

Вони, звичайно ж, дозволять вам наочно побачити всі можливості движка по роботі та управлінню контентом. Ви побачите реально, розміщені в позиціях для модулів вашого, подивіться організацію матеріалів в адмінці Джумли і, нарешті, дозрієте для того, щоб почати додавати свої власні статті, категорії та розділи, але для цього вам потрібно буде попередньо видалити всі демо-дані.

У разі встановлення двигуна разом з демонстраційними матеріалами створюється багато різних розділів, категорій та статей, які вам не знадобляться надалі. Їх треба буде видалити. Начебто б нічого складного, але треба знати кілька моментів, які можуть перешкодити.

По-перше, видалення треба починати з низу ієрархії, тобто. із статей. Не можна буде видалити категорію, в якій є статті, і не можна буде видалити розділ, у якому є категорії.

По-друге, стаття може бути заблокованою і для її видалення доведеться скидати блокування. Ну і окрім цього потрібно знати, що при їх видаленні з менеджера вони не будуть остаточно стерті, а потраплять у кошик, з якого їх теж потрібно буде прибирати. Але про все по порядку.

Для видалення статей у Joomla вам потрібно буде в адмінці вибрати з верхнього меню пункти "Матеріали" - "Менеджер матеріалів". У вікні можна за допомогою фільтрів вивести лише статті конкретного розділу або конкретної категорії.

Якщо ви в цьому списку навпроти якоїсь публікації бачите замість перемикача іконку замка, то це означає, що вона в даний момент знаходиться не в редагуванні. Тобто. у браузері відкрито вікно зі сторінкою редагування цієї статті. Або його ви закрили, але забули натиснути кнопку «Закрити» або «Зберегти» на сторінці редагування. Тому вона вважається відкритою і її не можна буде видалити з бази даних Джумли.

У цьому випадку, щоб заблоковану публікацію можна було б видалити, вам доведеться вибрати в адмінці з верхнього меню пункти "Інструменти" - "Скидання блокувань". Після цього всі матеріали будуть розблоковані та їх можна буде видалити:

У менеджері матеріалів ви можете вибрати окремі для видалення, поставивши навпроти галочки, або видалити відразу цілу пачку. Також можна скористатися фільтром для відображення матеріалів лише певного розділу або категорії, а потім вибрати в самому низу списку в області «Кількість рядків» варіант «Все»:

Тепер вам достатньо буде поставити галочку у самому верхньому полі стовпця, що сусідить із назвою, і натиснути на кнопку «У кошик», розташовану вгорі вікна. Усі виділені вами статті будуть перенесені до кошика:

Для остаточного їх видалення потрібно в адмінці вибрати з верхнього меню пункти «Матеріали» — «Кошик» і у вікні, що відкрилося, виділити всі статті, що знаходяться там, а потім натиснути на кнопку «Видалити», розташовану вгорі вікна:

Все, з матеріалами покінчено, тепер залишиться тільки зайти по черзі в менеджери категорій і розділів (з верхнього меню адмінки) і видалити всі непотрібні категорії, в яких немає статей, а потім непотрібні розділи, в яких вже немає категорій.

Ну ось, видаляти контент з Joomla ми навчилися, тепер саме час навчитися створювати його. Руйнувати, як відомо, простіше, ніж будувати. Про створення структури розділів і категорій не говоритиму, т.к. цьому у мене була присвячена ціла стаття (посилання на яку наведено трохи вище), а перейду одразу до додавання нового матеріалу.

Додавання та розподіл контенту в Joomla

Для цього вам потрібно буде вибрати з верхнього меню адмінки пункти "Матеріали" - "Менеджер". Відкриється вже знайоме нам вікно, де будуть відображатися заголовки всіх статей, що є у вас на сайті. Якщо ви щойно видалили всі демо-дані, цей список буде порожній. Давайте пробіжимося по панелі інструментів вікна редактора матеріалів і розглянемо призначення кнопок, що є там:

Перші дві кнопки "З архіву" і "В архів" служать для розпаковування статей з архіву і для розміщення їх в архіві. Дуже рідко використовується можливість роботи з архівами, на мій погляд, практично непотрібна і не потрібна в роботі.

Кнопки «Показати» та «Приховати» дозволяють здійснити масову публікацію (виведення матеріалів на сторінки сайту) або масове зняття з публікації. Для цього вам потрібно буде поставити галочки навпроти тих статей, до яких ви хочете застосувати цю дію, а потім натиснути одну з цих кнопок.

Налаштувати виведення матеріалів можна стосовно окремих статей у списку, натиснувши на червоний хрестик або зелену галочку в її рядку:

Кнопка "Перенести" дозволяє перемістити виділені матеріали (напроти яких ви поставите галочки) в іншу категорію або розділ Joomla. Кнопка «Копіювати» дозволяє їх лише скопіювати. «У кошик» дозволяє перемістити виділені матеріали в кошик, з якого їх потім можна буде відновити або остаточно видалити.

"Змінити" дозволяє відкрити виділену статтю на редагування (рівносильно натискання на заголовок матеріалу у списку менеджера). "Створити" дозволяє відкрити вікно додавання нового матеріалу, де ви зможете написати текст своєї статті.

Кнопка «Параметри» дає змогу вказати параметри за замовчуванням для всіх матеріалів. Вони будуть використовуватися за умовчанням для всіх нових матеріалів, які ви додаватимете в Джумлу надалі, а також для тих статей, які ви вже додали:

Практично ті самі параметри для матеріалів (за винятком деяких) ви матимете можливість змінювати при написанні або редагуванні кожної окремої статті (докладніше про це читайте наприкінці). Звичайно ж, набагато зручніше задати потрібні налаштування за замовчуванням, а при написанні статей змінювати їх тільки в разі необхідності, якщо вони не підходять для цієї конкретної публікації.

Створення в адмінці Джумли нової статті

Для додавання нового матеріалу нам потрібно буде скористатися кнопкою "Створити". В результаті відкриється вікно, що дозволяє ввести текст і зробити для неї різні налаштування:

Ви повинні буде заповнити поле «Заголовок», де потрібно вписати бажану назву, яку буде відображати на сторінках сайту. Поле "Псевдонім" слід заповнювати у тому випадку, якщо ви . Туди вам потрібно буде ввести латинськими літерами без пробілів фактично шматок майбутньої URL-адреси сторінки, якщо вона буде виводитися окремо за посиланням з меню.

У разі використання сторонніх компонентів для організації ЧПУ поле «Псевдонім» заповнювати буде не потрібно. Я вже писав. До речі, цей компонент допоможе вам ще створити сторінку помилки 404 належного вигляду, що також вітається.

Для нової статті вам потрібно вибрати будь-який розділ та категорію у відповідних полях. За бажання можете зробити її не належить до жодного, тобто. не класифікованою (може надалі використовуватися до створення про статичних сторінок). Для цього в полях "Розділ" та "Категорія" потрібно вибрати варіант "Не вказано".

Галочка в полі «Опублікована» означатиме, що після збереження вона одразу ж буде опублікована і може з'явитися на сторінках сайту, якщо для її виведення буде створено відповідний пункт меню. Ця публікація може бути виведена, наприклад, у складі категорії, для якої ви створили відповідний пункт меню (у вигляді Блога або Списку).

Наприклад, створивши пункт меню «Новини» типу «Блог категорії» та додавши нову статтю до неї, цей матеріал буде доступний на сайті при натисканні на посилання «Новини» в меню вашого проекту. Найскладніше для початківця зрозуміти, що в Joomla немає жодних сторінок як у статичному вебсайті, а весь вміст (контент), що додається вами в адмінці, зберігається в базі даних. На веб-сайті ж вміст відображається лише за наявності на нього посилань з меню.

Отже, спочатку потрібно додати контент, а потім уже створювати на нього посилання в меню вебсайту. Вони визначають не тільки те, що має відображатися на сторінці, але й те, як має бути вміст. Але це ми вже забігли дещо вперед і нам треба буде повернутися до створення нового матеріалу в адмінці Джумли.

У верхній частині вікна залишилося ще одне поле "На головній", де за замовчуванням активна галочка в положенні "Ні". Це означає, що ця стаття не виводитиметься на головну сторінку вашого сайту.

Усі публікації, при створенні або редагуванні яких ви поставите галочку в позицію «Так» цього поля, виводитимуться на головній у вигляді блогу. Керувати статтями, що виводяться на головну, ви зможете, вибравши з верхнього меню адмінки пункти "Матеріали" - "Менеджер головної".

В основному вікна додавання нового матеріалу ви зможете ввести текст майбутньої статті, використовуючи при цьому можливості вбудованого в Joomla візуального редактора. Особисто я волію використовувати інший візуальний редактор – JCE. Про те, як встановити JCE і зробити його редактором використовуваним за замовчуванням, читайте за посиланням, що наводиться трохи вище.

В принципі, робота у візуальному редакторі схожа на роботу в текстовому Word, за тим винятком, що в Joomla вам іноді все ж таки доведеться переходити безпосередньо до редагування HTML коду (є така кнопочка «HTML» на панелі інструментів редактора, що використовується за замовчуванням).

Ваша здатність розуміти та вносити зміни до HTML коду статті допоможе вам легко і швидко розрулити будь-який закидон візуального редактора. Тому, за потреби, раджу вам ознайомитись із вмістом рубрики мого блогу « ».

Особисто я, здебільшого, взагалі не використовую візуальний редактор, бо спочатку просто тренувався у використанні на практиці HTML коду, а потім вже звик обходитися тільки їм. Але це вже справа смаку та особистої переваги. Вважатимемо, що з створенням тексту статті та додаванням до неї при необхідності , а також зображень тощо. речей ви розберетеся самі.

Налаштування (параметри), які можна встановити при додаванні статті

Давайте розглянемо налаштування нового матеріалу, які ми зможемо зробити, використовуючи три вкладки з правої області вікна. Перша називається "Параметри - статті" і на ній ви можете вибрати в полі "Автор" того користувача, який вважатиметься її автором.

У полі «Псевдонім» можна вписати псевдонім, під яким буде опублікований цей матеріал, якщо ви не хочете показувати справжнє ім'я автора. Інформація про авторство буде виводитися у верхній її частині, але тільки в тому випадку, якщо ви поставите це в налаштуваннях для даного матеріалу, але про це поговоримо трохи нижче.

У полі «Доступ» можете вибрати ту групу користувачів, які зможуть побачити цю статтю (або всі або тільки зареєстровані користувачі або тільки адміністратори). У полі «Дата створення» ви зможете вказати дату створення і вона відображатиметься на сторінці зі статтею, якщо це не буде заборонено в налаштуваннях для цього матеріалу.

У полі "Опубліковано" зможете ввести, за потреби, дату відкладеної публікації. У цьому випадку, після того, як ви збережете цю статтю, вона з'явиться на сайті тільки з настанням зазначеної вами в цьому полі дати та часу.

Таким чином, перед від'їздом у відпустку можна додати відразу багато матеріалів в адмінці Joomla, але налаштувати їх почергову публікацію з інтервалом на добу і тим самим створити видимість вашої присутності. За промовчанням там буде прописана поточна дата та час.

У полі «Закінчується» можна встановити дату зняття цієї статті з публікації. Це може знадобитися, наприклад, під час проведення будь-якої разової акції, після якої вона вже непотрібна. За замовчуванням у цьому полі вибрано варіант «ніколи», який означає, що цей матеріал може бути знятий з публікації лише вручну. У цьому та попередньому полі для вибору дати потрібно буде клацнути по іконці календаря, розташованої праворуч.

Розширені налаштування статей (матеріалів) у Джумлі

На вкладці «Параметри — Розширені» вказані ті налаштування матеріалів, які будуть задіяні лише тоді, коли дана стаття буде повністю відображена на сайті (наприклад, коли відвідувач клацне на посилання «Докладніше» внизу анонсу статті при відображенні в Joomla блогу категорії). Найчастіше ці розширені параметри взагалі мало хто змінює, т.к. або не знають як це зробити, або не вважають це за необхідне.

Особисто я все ж таки вважаю, що деякі з цих розширених параметрів змінювати слід. Але, по-перше, це можна зробити відразу для всіх статей, клацнувши на сторінці менеджера матеріалів за кнопкою «Параметри» і вибравши потрібні налаштування для тих самих параметрів.

В результаті ці розширені налаштування для статей будуть застосовуватися за замовчуванням (варіант за умовчанням виглядає як «Використовувати глобальні») під час написання всіх нових матеріалів. Але ви можете створювати або редагувати контент, щоб змінити деякі з них.

Давайте детально розглянемо всі налаштування на вкладці «Параметри — Розширені», які ви можете зробити під час створення або редагування матеріалу в Joomla:

Наступна вкладка налаштувань у вікні створення нового матеріалу називається "Мета-дані":

Тут ви можете задати невидиму на сайті інформацію про статтю, яка в першу чергу призначена для пошукових систем. Насправді деякі поля на цій вкладці теж мають досить сильне значення на пошукову оптимізацію. Я вже докладно писав про це, тому не вважаю за потрібне повторюватися. Там же .

Удачі вам! До швидких зустрічей на сторінках блогу сайт

Вам може бути цікаво

Створення та виведення статей (контенту) у Джумлі за допомогою розділів та категорій, блог на Joomla та кнопка Детальніше
Що таке Joomla
Модулі виведення списку розділів у Joomla, випадкових та останніх новин, схожих матеріалів, довільних фото та Html коду
Як створити в Joomla блог на основі категорії або розділу за допомогою пункту меню, а також інші варіанти виведення контенту
Контакти для сайту та форма зворотного зв'язку за допомогою вбудованого компонента Joomla
Компонент K2 для створення блогів, каталогів та порталів на Joomla - можливості, встановлення та русифікація
Модулі в Joomla - перегляд позиції, налаштування та виведення, а також призначення суфіксів класу
CMS Joomla - принципи роботи безкоштовної системи керування контентом, створення сторінок та їх кешування
Як оновити статичний Html сайт до динамічного на Joomla
Створення картки для сайту на Joomla за допомогою компонента Xmap

/ 2008-09 Joomla! Community Magazine

У цій статті я покажу вам простий спосіб додати новий параметр до Типу Меню (Menu Type), який дозволить Вам додавати кастомне зображення до назви статті на Joomla! сайт. Цей метод схожий на використання «Суфікса Класу Сторінки» та «Суфікса Класу Модуля» для індивідуального оформлення контенту, пов'язаного з певним меню або модулем. Я вибрав метод, описаний нижче, замість «Суфікса Класу Сторінки», оскільки суфікс впливає не так на певний параметр, але в пов'язані елементи сторінки. У цьому простому прикладі я просто хочу додати один параметр до одного елемента на сторінці - Назва статті.

1. Для початку створимо дані для прикладу.

Давайте створимо типові дані для використання в процесі роботи:

Створіть "Розділ" під назвою "Статті". Далі створіть три Категорії. Для цих категорій ми розширимо юзабіліті, додаючи відповідне зображення до кожної статті категорії.

Далі створіть чотири текстові статті з контентом для прикладу кожної категорії. Я рекомендую використовувати для цього розширення Mass Content.

2. Додамо новий параметр до XML «Тип Меню»

Перейдіть до кореневої директорії вашого сайту на Joomla! і виконайте папку «tmpl» згідно з цим шляхом — components/com_content/views/category/tmpl.

Відкрийте blog.xml і додайте наведений нижче параметр відразу після рядка позначеного тегом . Зробіть те саме для файлу default.xml.

Важливо: У цьому прикладі параметр «description» починається з нового рядка. При введенні коду в файл xml обов'язково простежте, щоб весь код був в одному рядку без будь-яких переносів рядків.

3. Створюємо кастомний шаблон (Template Overrides)

У Joomla! 1.5 ми маємо чудову можливість створювати власні шаблони для заміни стандартних шаблонів виведення контенту представлених в ядрі за замовчуванням. Кастомні шаблони (Template Overrides) дуже зручні та прості у використанні. Спочатку ми копіюємо файли розмітки з основних компонентів до папки «html» у папці нашого шаблону. Далі, ми робимо зміни. Коли Joomla! знаходить файли розмітки користувача у вашій папці templates/ваш_шаблон/html/, вона використовує ваші файли, і «ігнорує» файли розмітки в ядрі.

Щоб це зробити, увійдіть у /templates/ваш_шаблон/ паку. Створіть нову паку та назвіть її «html». У папці html створіть нову директорію і назвіть її «com_content». Якщо у вашому шаблоні вже є директорії html або com_content, то вам пощастило і створювати їх не треба.

У папці «com_content» створіть дві папки; одну назвіть "article", а іншу назвіть "category".

Наприклад:

/templates/rhuk_milkyway/html/com_content/category /templates/rhuk_milkyway/html/com_content/article

Тепер скопіюйте (не переміщати!!!) файли розмітки в ядрі - components/com_content/views/category/tmpl/blog_item.php файл /templates/ваш_шаблон/html/com_content/category

Примітка: якщо файл вже існує, краще не переписувати це. Ви можете продовжувати виконувати дії, наведені у прикладі, використовуючи наявний файл.

Знову скопіюйте (не переміщати!!!) components/com_content/views/article/tmpl/default.php в /templates/ваш_шаблон/html/com_content/article

Додаємо елементи оформлення для виведення іконок у файлі розмітки

Відкрийте файл /templates/ваш_шаблон/html/com_content/category/blog_item.php для редагування.

item->params->get("pageclass_sfx"); ?>" width="100%">

»

class=»contentpagetitle»>

»>

»>

Тепер відкрийте нещодавно скопійований /templates/ваш_шаблон/html/com_content/article/default.php файл.

Ви побачите код, наведений нижче, крім тих рядків, які виділені червоним, вони є тими елементами, які ми додамо і потім збережемо цей файл.

params->get("pageclass_sfx"); ?>" width="100%">

»

class=»contentpagetitle»>

»>

»>

4. Додаємо стилі CSS та картинки

Добре ми підготували базові елементи шаблону Joomla, а тепер перейдемо до дизайнерської частини даного уроку.

Перше, що нам потрібно зробити, — підібрати іконки для вищезгаданих категорій (FAQ, Медіа, Книги). Для цього можна використовувати іконки з набору silk icon set , вони вже мають бажаний розмір (16px), файли PNG-32 з прозорістю і, звичайно ж, безкоштовні.

Я вибрав три наведені нижче. Ви можете просто скопіювати ці картинки та помістити в /templates/ваш_шаблон/images.

Тепер відкривайте ваш основний CSS-файл шаблону (зазвичай template.css) /templates/ваш_шаблон/css/template.css і додавайте наступний CSS код:

background: url(../images/info.png) no-repeat 0px 5px;

background: url(../images/photo.png) no-repeat 0px 5px;

background: url(../images/book_open.png) no-repeat 0px 5px;

Призначаємо стилі пункту меню (Menu Item)

У наведеному вище коді ми можемо побачити назви потрібних класів (тобто faq, media, book). Це і є параметри, які ви тепер зможете використовувати, для введення в менеджері меню.

Для того, щоб це зробити, спочатку увійдіть до панелі адміністрування Joomla! і створіть новий пункт Меню, використовуючи «Блог — вміст категорії» як виведення вмісту.

У параметрах пункту меню праворуч ви побачите вкладку «Розширені», де Ви побачите новий параметр, названий «Article Icon Class». Ви можете ввести в поле одне з трьох значень: faq, media, або book. Після того як ви збережете свій новий пункт меню, перегляньте Блог Категорії фронтенду вашого Joomla! сайту та виберіть новий пункт меню. Як тільки ви дістанетеся до статті, ви побачите новий варіант виведення назви з іконкою.

Якщо ви хочете змінити існуючі параметри або додати більше, все, що ви повинні зробити, додати новий клас CSS, як показано на прикладі вище. Сподіваюся, ви застосовуватимете цей спосіб у своїх шаблонах. Насолоджуйтесь Joomla!

Додатковою ідентифікацією вашого сайту Joomla може стати унікальна іконка або favicon. Favicon на сайті Joomla відображатиметься у браузерах у назві вкладок та зроблених закладках разом зі всіма сторінками вашого сайту. За замовчуванням усі сайти керовані CMS Joomla мають однакові стандартні іконки. Відрізняються лише іконка для видимої частини сайту Joomla та для адміністративної панелі. Іконку для сайту, яку бачать відвідувачі, можна легко поміняти.

Чи потрібно міняти іконку (favicon) сайту Joomla

Заміна іконки сайту впливає лише на суб'єктивну складову оптимізації сайту. Відвідувач, зробивши закладку сторінки сайту, може потім легко знайти її у списку всіх своїх закладок. Крім цього, іконка сайту відображається в пошуку і в прикладних інструментах. наприклад, у списку сайтів у Яндекс веб-майстер.

Крім цього, замінивши стандартну іконку Joomla, ви припините афішувати, що ваш сайт управляється Joomla, а це один з кроків, що підвищують безпеку сайту.

Вимоги до нової іконки Joomla

Слово Favicon це скорочення від двох англійських слів, favorites та icon . Для ікон Joomla є свій стандарт. Їх розмір має бути 16×16 або 32×32 пікселів. Зроблений favicon повинен бути в 256 колірній гамі. І головне, формат іконки Joomla має бути favicon .ico.

Кроки по заміні іконки (favicon) сайту Joomla

Заміна іконки сайту Joomla здійснюється за кілька простих кроків:

• Згенерувати унікальну іконку з будь-якого фото формату PNG або JPEG. Або намалювати іконку самостійно, використовую онлайн-сервіси або фото програми;
• Зробити з зображення favicon формат ico, розмір 16(32)×16(32) px;
• Завантажити нову іконку, в каталог сайту, видаливши при цьому всі старі favicon;
• Вставити спеціальний код шаблон головної сторінки свого сайту.

Розберемо кожен крок докладно.

Крок 1. Створення іконок для сайту Joomla

В інтернет є багато online інструментів для генерації іконки у форматі favicon .ico з будь-якої фотографії. Тут слід звернути увагу на наступне.

Якщо ви хочете, щоб ваш favicon був без білого фону, його джерелом має бути з прозорим фоном при створенні і у форматі PNG при збереженні . Використовуючи фото форматів, відмінних від png, ви отримаєте Favicon з білим або чорним фоном. Відмінні сховища іконки в інтернеті ви знайдете у верхньому меню цього сайту в пункті: Інструменти веб-майстра.

Генератори favicon ви можете знайти самостійно, вписавши у вікні пошуку: генератор favicon .Тут наведу адреси генераторів іконок.

pr-cy.ru/favicon

tools.dynamicdrive.com/favicon

• iconfinder.com
• freepik.com/free-icons
• genericons.com
• flaticons.net
• iconbird.com
• iconizer.net
• webhostinghub.com
• iconspedia.com
• iconsearch.ru
• icons8.com
• glyphicons.com
• findicons.com
• icomoon.io
• iconarchive.com
• themify.me
• thenounproject.com
• flaticon.com

Робиться іконки Favicon наступним чином

• Наперед знаходьте оригінальну картинку для своєї майбутньої іконки;
• Відкриваєте генератор;
• У вікні завантажувача вибираєте свою іконку на комп'ютері. Вибираєте розміри майбутньої іконки для Joomla 16×16 пікселів;
• Натискаєте кнопку типу «Зробити».
• Favicon генерується за лічені секунди. Далі залишається лише скачати її на свій комп'ютер. Для цього є своя кнопка "Download". Іконка на комп'ютері, потрібно закачати її в каталог.

Крок 2. Завантажити нову іконку до каталогу сайту

З місцем у каталозі сайту, куди потрібно завантажити нову іконку (favicon) сайту ситуація наступна.

Раніше обов'язковим місцем розміщення favicon .ico був кореневий каталог сайту. Нині ситуація трохи пом'якшала. Використання динамічних шаблонів дозволяє закачувати іконку до будь-якого каталогу свого сайту, тільки в коді (нижче) потрібно чітко прописувати шлях до цього каталогу. Але при цьому потрібно пам'ятати, чим далі іконка від кореня сайту, тим довше вона завантажуватиметься у браузері. А за швидкість завантаження сайту потрібно боротися, навіть у дрібницях.

class="eliadunit">

Тому раджу завантажити основний favicon в корінь сайту Joomla. Для завантаження потрібно FTP клієнт або авторизація в адміністративній панелі на хостингу. Перед завантаженням нової іконки (favicon ) перевірте всі папки сайту та видаліть або перейменуйте старі favicon , які були встановлені в завантажених вами шаблонах. Окремо перевірте папку з шаблоном. З підпапок шаблону видаліть файл favicon.ico. Після того, як видалили старі favicon, завантажуйте новий в корінь сайту. Favicon у каталозі сайту залишається вставити код у шаблон головної сторінки сайту.

Примітка: На цьому етапі іконка сайту може змінитися. У деяких шаблонах код для показу іконки (про код нижче) вже прописаний у шаблоні сайту і тому при заміні іконки в каталозі вона може змінитися і в закладці браузера. Тільки щоб це побачити, потрібно очистити кеш сайту і, можливо, перевантажити браузер.

Крок 3. Вставляємо код шаблон сайту для відображення іконки favicon

Примітка: Цей спосіб застарів, в основних браузерах новий іконка відображається без вставки цього коду. Достатньо видалити всі старі фавікони з кореня сайту та шаблону. а також очистити кеш браузера та сайту.

Код (нижче) вставляється у шаблон головної сторінки сайту Joomla між тегами (приклад нижче). В інтернет ви можете знайти кілька варіантів кодів (favicon), для сайтів Joomla. Наведу приклад тільки тих кодів, які працюють на всіх сайтах Joomla .

Код перший. Іконка з'являється практично миттєво після очищення кешу сайту.

Код другий. Через відсутність показу браузеру типу елемента форми (type) ця іконка з'являється у браузері через 1-2 доби.

Третій код. Для іконки (favicon) розміщеного над кореневому каталозі (patch-to це шлях до папки з favicon).

• Працюють коди і з таким написанням SHORTCUT ICON, і з таким Shortcut icon
• Якщо код вашого сайту HTML, а не XHTML, то закінчувати код потрібно ">", а не "/>"

Якщо вам потрібно відображення іконки в браузері IE, спробуйте додати такий код:

Після вставки коду в шаблон не забувайте зберегтися, також очистіть кеш сайту.

• Адміністративна панель >>>Сайт>>>Обслуговування>>>Очистити весь кеш (для версій Joomla 1.7-2.5-3.х)
• Адміністративна панель>>>Інструменти >>>Очистити весь кеш (для версії 1.5)

Приклад вставленого коду для відображення іконки сайту:

З цього туторіалу Ви дізнаєтеся, як використовувати зображення замість тексту для елементів меню Joomla.

Існує кілька способів додавання значків у меню:

Додавання зображень у меню за допомогою Менеджер Меню

Стандартний модуль Joomla для роботи з меню дозволить Вам замінити назви пунктів меню на зображення:

Додавання зображень за допомогою коду CSS

Другий спосіб ґрунтується на додаванні класу css зображення до файлу (де ### — це номер вашого шаблону). Деякі модулі меню Joomla, такі як модуль IceMegaMenu, не дозволять Вам додати зображення для елемента меню в адмін панелі. Ви можете додати зображення, використовуючи код css:

Використовуючи фонове зображення у коді css:

Використовуючи значки FontAwesome:

Досліджуйте ваш сайт, використовуючи Інструмент розробника, для того щоб знайти клас css.

Внесіть зміни до файлу templates/theme###/css/templates.css (де ### — це номер шаблону).

Код CSS, який потрібно додати до файлу, виглядає так:

#iceMenu_101 .iceMenuTitle:before ( font-family: FontAwesome !important; content: "###" !important; font-size: 45px !important; top: 20px !important; position: relative !important; display: inline-block !important; line-height: 45px !important; height: 90px !important;

Де ### — це клас значка FontAwesome. Список доступних значків можна знайти на сайті FontAwesome.

Перевірте ваш сайт, щоб переглянути зміни.

Тепер Ви знаєте, як використовувати зображення замість тексту в елементах меню Joomla.