Зазвичай я лише коригую існуючі вільні шаблони та змінюю кольори та шрифти. Питання полягає в тому, що коли у мене вже є моя сторінка Joomla в Інтернеті, який найпростіший спосіб внести зміни в css шаблону?

Наразі я використовую Інструменти розробки Chrome, щоб знайти та коригувати певні стилі попереднього перегляду. Якщо мені це подобається, я коригую файл css шаблону безпосередньо в онлайн-редакторі в області адміністрування.

Коли я вперше запустив, і у мене не було жодного контенту, я використовував локальний веб-сервер з Joomla, який мав перевагу, що я міг використовувати належний IDE для написання css та php-коду. Оскільки я вже маю деякий вміст, я хотів би побачити, як виглядають зміни, які я вношу, із вмістом, який я маю.

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

Клоніруйте лайфстайл за допомогою Akeeba, встановіть його локально, а потім відрегулюйте за потребою. Коли ви закінчите SSH / FTP, змінені файли повернуться на активний сайт.

Є ціла низка вагомих причин, чому недоцільно «підлаштовуватися» на прямому сайті…

Тут є кілька варіантів, залежно від того, чи ваша увага - це простота використання, автоматизація чи вартість:

• Зробіть саме те, що ви робили раніше з локальною установкою, але, встановивши її, змініть локальну установку Joomla, щоб використовувати вашу живу віддалену базу даних MySQL configuration.php, якщо ваш хост підтримує віддалений доступ. Але будьте обережні - будь-які зміни в БД перейдуть у прямому ефірі ...

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

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

• Оплатіть належний шаблон / рамки шаблонів - у моїй компанії ми використовуємо шаблони YooTheme . Цей шаблон шаблону має функцію під назвою "Customizr", яка в основному є двопанельним вікном із сотнями змінних CSS (ну, менших змінних) ліворуч та живим попереднім переглядом праворуч. Ці змінні керують достатньо близько кожного елемента шаблону, від прокладки жолоба до текстового пункту меню та всього іншого. Зміни застосовуються миттєво в попередньому перегляді, і можна визначити кілька стилів, щоб ви могли грати з різними конфігураціями змінної. Все це говорив, я впевнений, що інші рамки шаблонів мають дуже схожі функції.

NB: У мене немає ніяких стосунків з extplorer і YooTheme, крім користувачів.

Якщо ви вносите лише зміни CSS, ви можете продовжувати попередній перегляд їх у Інструментах розробки Chrome, використовуючи онлайн-середовище розробки, наприклад Cloud9 або ShiftEdit, ви можете підключитися безпосередньо до свого сервера через FTP та робити налаштування на веб-сайті, використовуючи відповідний IDE подібно до того, як у вас, коли він розміщувався на місцях.

Однак я б не рекомендував це для будь-яких більших змін, які можуть порушити ваш сайт (я навчився важкому шляху кілька років тому). Для цього я рекомендую налаштувати локальний сервер (або безкоштовний VM від koding.com ), клонувати сайт за допомогою Akeeba та використовувати Git * для перенесення змін на ваш веб-сайт після їх тестування.

* Якщо ви не хочете, щоб ваш код був загальнодоступним на GitHub, однією з хороших альтернатив є BitBucket .

Спосіб 1

Один із методів, який я використав, - це додати власний файл css до файлу шаблону index.php. Це можна обернути, щоб додати його лише якщо ви користувач.

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

Щось на зразок...

class plgSystemBB extends JPlugin {
    public function onBeforeCompileHead() {

    if (JFactory::getUser()->username == 'my.login.name.goes.here')
    {
        JFactory::getDocument()->addStylesheet("/templates/protostar/css/test.css");
    }

    if(!JFactory::getApplication()->isAdmin()){
        return;
    }   

    JFactory::getDocument()->addStylesheet("/templates/isis/css/admin-extra.css");
}

Спосіб 2

Щоб переглянути зміни шаблону, ви можете дублювати шаблон і вносити зміни в дублікат. Щоб переглянути ці зміни, додайте "? Template = test" до URL-адреси, що перекриває шаблон. Замініть "тест" будь-яким ім'ям, яке ви вирішили використовувати для дубліката.

Зауважте, що вам потрібно дублювати весь шаблон, а не лише стиль. І стилі, і шаблони можна дублювати в адміністративному інтерфейсі.

Я не вірю, що можливо змінити стиль у URL-адресі. [PW: Я щойно з'ясував, що в J3 ви можете змінити стиль в URL-адресі. Дивіться метод 3.]

Спосіб 3

Схожий на метод 2, але зі стилями. Використовуйте стиль "тестування" та змініть основний шаблон, щоб він включав таблицю стилів тесту. Щоб замінити стиль у URL-адресі, додайте? TemplateStyle =, де ідентифікатор шаблону (тобто числовий).