joomla вставить php код в материал
Как вставить PHP код в Joomla
Рано или поздно мы сталкиваемся с необходимостью оживить, улучшить и оптимизировать наш сайт, снабдив его динамическим содержимым. И здесь на помощь приходят различные методы и языки, наиболее популярные и широкоиспользуемые из них это CSS, JavaScript и PHP.
CSS определяет внешний вид элементов, их цвета, размеры, позиционирование на странице и, в некоторых случаях, анимацию.
Зачем же нужен PHP и в чем разница между JavaScript и PHP?
PHP в отличии от JavaScript’a – серверный язык программирования, и результатом его выполнения (компиляции) является HTML-код, готовая веб-страница (которая зачастую может содержать фрагменты JavaScript’a). PHP выполняется один раз в момент загрузки страницы и отвечает собственно за то, какая страница или какое содержимое будет передано браузеру. Как только страница загрузилась, PHP закончил свою работу и включится снова лишь тогда, когда будет совершен переход на другую страницу (или обновление текущей по F5), либо обращение через Ajax.
Но если вы точно и окончательно решили вставить код php в Joomla – могу посоветовать плагин, который снимает запреты и позволяет вставлять php-код непосредственно в материал (не забудьте отключить визуальные редакторы – они также будут обрезать вхождения JavaScript или PHP кода).
Плагин называется DirectPHP.
UPD.: Также можете обратить внимание на такое расширение, как Sourcerer.
После его установки и активации вы можете испробовать его в действии, поприветствовав мир всеми любимой фразой:
Однако более правильный путь — научиться писать модули и плагины и встраивать их прямо в материал методом (для модуля mod_login)
А также разобраться с переопределениями в компонентах и модулях.
Продолжаем наполнять наш сайт материалами, сегодня будем создавать статью под названием Контакты. Посмотрите на нее на сайте-образце. Из нового здесь присутствует карта Google.
Итак, создаем материал под названием Контакты (contact). Копируем текст материала, кроме карты, форматируем и сохраняем статью:
В 5 уроке мы говорили, что модуль отвечает за то, в каком месте сайта или страницы будет отображаться информация. Значит для его использования нам необходимо модуль создать и указать, где его отображать.
и нажимаем на кнопку Новый:
Ставим галочку у Special HTML и нажимаем кнопку Следующая:
Копируем этот код, вставляем его в параметры нашего модуля и сохраняем:
Таким образом, мы создали модуль с кодом карты (map1), а в статье указали, где этот модуль надо отобразить (loadposition). Сохраняем нашу статью. В следующем уроке мы создадим меню и увидим, как выглядят страницы нашего сайта, а пока подведем итог этого урока:
Чтобы вставлять в Joomla html/JavaScript-код, необходимо:
Если этот сайт оказался вам полезен, пожалуйста, посмотрите другие наши статьи и разделы.
Вставка (подсветка) кода в статьи Joomla
Как вставить в статьи Joomla код на CSS, HTML, Php, JavaScript, C#, Java и других языках?
Для этого в Joomla 1.5 надо включить мамбот «Content — Code Hightlighter (GeSHi)». Затем в саму статью можно вставлять код вида:
Если всё равно не работает подсветка:
Когда подсветка сработала можно перейти к редактированию CSS файла шаблона. Например,
У меня в Joomla 1.5 на странице статьи всё показывалось нормально, а на главной странице (и любой странице типа «блог») каждая статья находилась внутри таблицы TABLE.blog, и блок PRE, содержайщий длинную строчку, вытягивался на всю ширину строки. Помогла вставка в CSS файл шаблона следующих строк:
Но хотелось бы иметь плагин к JCE. И он есть… Читать про это
Добавить комментарий Отменить ответ
Рекомендую
Рекомендую всем хостинг Timeweb. Всё работает замечательно. Замечательно подходит для больших проектов, особенно на Битриксе. Были проблемы с VDS на FreeBSD, но давно
Также рекомендую хостинг 1gb.ru. Работает хорошо. Особенно радует техподдержка. Как-то раз они даже в мой PHP-код залезли и помогли решить проблему. Можно подобрать достаточно дешёвый тариф. Не нравится, что 1gb достаточно жёстко реагируют на превышение нагрузки, но можно создать тариф с достаточно большой допустимой нагрузкой.
Разработка сайтов
Я окончил математико-механический факультет. Более 10 лет занимаюсь веб-программированием. На данный момент, в основном, пользуюсь CMS WordPress и 1С-Битрикс. По поводу создания или доработок сайтов на этих и других CMS пишите мне:
Создаем шаблон Joomlа по стандартам — часть 1 (продолжение)
Это продолжение статьи. Начало здесь.
index.php
Чем на самом деле является файл index.php? Это комбинация (X)HTML и PHP, которая определяет все необходимое для отображения элементов страницы.
Сначала посмотрим на элемент, который крайне важен для создания валидных шаблонов — DOCTYPE в верхней части файла index.php. Этот фрагмент кода отображается в верхней части всех веб-страниц. На страницах нашего шаблона мы видим следующее:
Первое строчка на PHP предназначена просто для того, чтобы убедиться, что к файлу не обращаются напрямую, из соображений безопасности.
DOCTYPE веб-страницы — это один из фундаментальных параметров, на основании которого браузер решает, как ему отображать эту страницу, в частности, как браузеру интерпретировать CSS. Для лучшего понимания приведем здесь хорошую цитату с сайта alistapart.com:
[Информация на сайте W3C о DOCTYPE] составлена гиками для гиков. И когда я говорю «гики», я не имею в виду обычных профессионалов Веб, таких как я или вы. Я имею в виду тех гиков, которые заставляют нас выглядеть как Бабушку в тот день, когда Она Впервые Получила E-mail.
В любом случае, вы можете использовать разные DOCTYPE. По существу, DOCTYPE говорит браузеру, как интерпретировать страницу. С самого начала, когда появился Веб, разные браузеры имели разные уровни поддержки CSS. Так, например, Internet Explorer не поймет команду «min-width», используемую для установки минимальной ширины страницы. Для того, чтобы продублировать эффект, вам придется использовать «хаки» в CSS.
Некоторые говорят, что обработка XHTML как text/html должна считаться «вредной». Если вы действительно понимаете это утверждение, то вы находитесь далеко за пределами этого руководства. Вы можете прочитать больше на эту тему по адресу hixie.ch/advocacy/xhtml. «Strict» означает, что HTML (или XHTML) должен интерпретироваться в точности по стандартам. А «Transitional» в DOCTYPE означает, что на странице дозволены определенные отступления от стандартов.
Чтобы усложнить картину, добавим, что существует еще так называемый режим «quirks» (специальных ухищрений). Если DOCTYPE указан неверно, с неправильной датой, или вообще не указан, браузер переходит в режим «quirks». На самом деле, это попытка обеспечения обратной совместимости, так, например, Internet Explorer 6 будет интерпретировать страницу так, как это делал бы IE4.
Далее указывается следующее XML-выражение (после DOCTYPE):
Пояснения насчет режима «quirks» в IE очень важны. В этой статье мы разрабатываем шаблон для IE6+, следовательно мы должны быть уверены, что он работает в стандартном режиме. Это минимизирует необходимость хаков, которые нам придется позже применить.
ПРИМЕЧАНИЕ
Создание страниц, соответствующих стандартам, когда вы видите «valid xhtml» в нижней части страницы, не означает в действительности трудоемкой верстки или использования малопонятных тегов. Это просто означает, что разрабатываемый вами код, соответствует заявленному DOCTYPE, и ничего более.
Разработка сайта по стандартам может быть описана одной фразой как «говори, что ты делаешь, а затем делай то, что говоришь».
Что еще есть в файле index.php?
Посмотрите сначала на структуру заголовка. Мы хотим быть минималистичны, насколько это возможно, но при этом иметь все необходимое для создания работающего сайта. Мы используем следующий заголовок:
Что все это означает?
Мы уже рассказывали о значении DOCTYPE в файле index.php. Фрагмент извлекает установленный язык из глобальной конфигурации.
Следующий фрагмент включает дополнительную информацию для заголовка:
Это заголовочная информация, которая задана в глобальной конфигурации. Она включает в себя следующие теги (в инсталляции по умолчанию):
Большая часть этой информации генерируется «на лету» в соответствии с данными текущей страницы (статьи). Она включает в себя ряд мета-тегов для favicon, адресов RSS-потоков и некоторых стандартных JavaScript-файлов.
Последние строки в заголовке содержат ссылки на CSS-файлы шаблона:
Первые два файла — system.css and general.css содержат некоторые основные стили Joomla. Последний содержит все стили шаблона и называется здесь template.css. Фрагмент кода PHP возвращает название текущего шаблона. Указание его именно таким образом, вместо реального пути, делает код более переносимым. Когда вы создаете новый шаблон, вы можете просто скопировать его (включая весь заголовок), не беспокоясь о внесении исправлений.
В заголовке может быть указано любое количество CSS-файлов, например, для условных стилей, определяемых для разных браузеров. Например, следующий фрагмент определяет такую таблицу стилей для IE6:
Следующий пример показывает, как могут использоваться параметры шаблона:
Пустое тело шаблона
Создание нашего первого шаблона будет очень-очень простым! Вы готовы?
Все, что необходимо, — это использовать выражения Joomla, которые добавят содержимое всех модулей в основное тело страницы (mainbody):
В настоящий момент наш сайт не вылядит особенно впечатляюще (см.
иллюстрацию)
Что необходимо знать
По существу, шаблон просто загружает модули Joomla и mainbody (компонент). Расположение элементов и дизайн — это дело CSS, а не Joomla.
Нашей целью является как можно ближе приблизиться к семантической разметке. С точки зрения Web, это означает, что страница может быть прочитана браузером, «пауком» поисковой системы или устройством чтения с экрана. Семантическая разметка является краеугольным камнем доступности.
Примечание
На самом деле, мы имеем здесь только некий потенциал для семантической разметки. Например, если размещать случайные модули в случайных местах, то мы получим полную путаницу. Важным взглядом на CMS-сайты является то, то шаблон ровно настолько хорош, насколько хорошо его наполнение контентом. Именно поэтому так часто придираются к дизайнерам, пытаясь проверять их сайты на валидность.
Вы заметили, что мы впервые использовали набор команд, специфичных для Joomla:
PHP-выражение «echo» просто отображает строку из файла configuration.php. Здесь мы использовали название сайта, но можно, например, отобразить и другие параметры:
Выражение «jdoc» вставляет различные типы XHTML-вывода, как модулей, так и компонентов. Следующая строка вставляет вывод компонента. Какой компонент будет использован, будет определяться ссылкой в меню:
ПРИМЕЧАНИЕ
Достаточно интересно, вам кажется, что вывод компонента можно использовать несколько раз. Не уверен, что вам захочется сделать это, но я говорю вам, что это может быть ошибкой.
Эта строка вставляет вывод всех модулей, заданных для места «right»:
На самом деле, полный синтаксис такой:
Мы рассмотрим различные варианты опций для стилей в разделе о модулях позднее.
Создаем свой шаблон для Joomla. Пошаговое руководство
В этой статье пойдет речь о создании своего шаблона для Joomla 3.х с возможностью изменения настроек через административную панель самой системы управления.
Зачем это нужно? Наверняка вы слышали о том, что CMS Joomla «тяжелая», в ней постоянно выскакивают ошибки, «едет» верстка, «отваливаются» скрипты. В основном это связано с шаблоном, который вы используете, а именно – с подключением множества плагинов и скриптов, фреймворков (как css/js, так и php), которые в процессе работы сайта и для его продуктивности практически не нужны. Поэтому мы сталкиваемся с долгой загрузкой в Google Page Speed и многочисленными ошибками, которые влияют на продвижение сайта в поисковиках.
Для решения этой проблемы мы сделаем свой шаблон (template), в котором можно будет настраивать внешний вид, менять цвета, добавлять информацию. Настройками можно легко управлять с помощью административной панели самой Joomla.
Чтобы справиться с задачей, достаточно навыков верстальщика и немного времени, чтобы разобраться со структурой и логикой работы. Вы сможете интегрировать любой тип сайта – от визитки до интернет-магазина.
Итак, статья для вас, если:
Структура шаблона
Для начала нам необходимо создать папку со следующим содержимым. Попутно поясняю, что и зачем нужно, простым языком, чтобы разобраться мог каждый (начнем с конца):
1. templateDetails.xml – файл, в котором мы описываем информацию о разработчике, версии, вносим информацию о содержимом, позиции модулей, языковые файлы, настройки.
2. template_preview.png, template_thumbnail.png – изображения шаблона, можно в Adobe Photoshop сделать в виде иконок. У меня они такие:
3. index.php – главный файл, в котором будет подключение скриптов, параметров, модули. И самое главное – верстка.
4. index.html – пустой файл html, который должен содержаться в каждой папке, чтобы мошенники не смогли просмотреть содержимое.
5. error.php – страница 404, можно настраивать как угодно, тем самым уйти от стандартной страницы 404 Joomla, которая выглядит не очень презентабельно 🙂
6. language – языковые файлы, если собираетесь делать шаблон мультиязычным.
7. js – папка со скриптами, со временем можно подключить все самое необходимое для работы сайта.
8. images – говорит само за себя, здесь хранятся картинки шаблона. Рекомендую здесь хранить картинки, относящиеся только к оформлению, так как будет неудобно грузить картинки для статей именно в папку шаблона.
9. html – папка для переопределения модулей и компонентов Joomla. Об этом поговорим позже, но, забегая вперед, скажу, что в этой папке храним все то, что не должно перезаписаться при обновлении модуля или компонента.
10. fonts – в эту папку можно подключить шрифты для сайта, если таковых нет на Google Fonts. Гугл шрифты лучше подключать через основной шаблон. Так вы получите более высокую оценку в Google Page Speed.
11. css – папка со стилями для шаблона, которые мы подключим к нашему шаблону.
Файл templateDetails.xml
Дальше нам нужно заполнить этот файл содержимым, которое будет описывать позиции модулей, настройки, информацию о версии и разработчике, языковые файлы. Рассмотрим подробнее.
1. Первая строчка обязательная, содержит версию xml и кодировку:
2. Далее открываем тег extension и начинаем описывать наше приложение:
Указываем версию Joomla, тип расширения, клиент установки и метод установки.
3. Рассмотрим следующие строчки.
В данном виде содержится языковая переменная (как пример), ниже рассмотрим, как это используется на практике.
Здесь и так все понятно 🙂
Тоже не нуждается в пояснении:
Информация о лицензии:
Всю информацию в этом блоке описываете на свое усмотрение.
4. Следующим шагом нужно описать файловое содержание, то есть перечисляем в теге files все файлы и папки, которые необходимо установить.
5. Языковые файлы. Если вы делаете шаблон для русскоязычной аудитории – в этом нет необходимости, можно не добавлять этот раздел, а в теге description выше в описании шаблона можно просто написать русское описание напрямую. Но, если приложение предназначено и для других стран, достаточно будет добавить англоязычную версию по примеру ниже.
Языковые файлы при установке добавятся в глобальную папку языков и автоматически будут подхватываться Джумлой в зависимости от выбранной локализации в админ-панели.
Самое главное – верно указать теги и названия файлов. Все аналогично для любой локализации, сейчас рассматриваем на примере русской локализации.
TPL_UNIVERSUM_DESCRIPTION – это и есть переменная, которую мы запишем в языковой файл, и Joomla будет «подтягивать» значение из него.
Открываем файл ru-RU.tpl_universum.ini и записываем значение переменной:
Можно записать любое значение, главное – без перехода на новую строку, иначе работать не будет. Также можно использовать html для красивого оформления сообщений.
Результат добавления description можно увидеть при установке шаблона:
Чтобы увидеть эту же информацию в настройках, необходимо эту же переменную добавить в файл ru-RU.tpl_universum.sys.ini:
Идем дальше.
6. Описываем позиции шаблона (что и где у нас будет выводится), для этого потребуется раздел positions:
Если у вас уже есть html-верстка, то важно заранее продумать, какие блоки и позиции нужны, где и что будет повторяться, и, исходя из этой информации, спланировать позиции модулей. Если прописать позиции напрямую в шаблоне и не указать ее в этом файле, это повлияет только на отображение списка позиций при публикации модуля, но можно записать вручную, и модуль опубликуется.
7. Параметры шаблона. В этом разделе мы можем указать настройки, которые можно менять в административной панели Joomla. Это удобно, чтобы клиенту или администратору не пришлось открывать файлы с кодом, а можно было изменить информацию в пару кликов. Настройки шаблона могут быть самые разные и зависеть только от вашей фантазии. Мы рассмотрим самые основные, которые помогут вывести необходимую информацию и отредактировать цвета оформления, зачастую этого достаточно. Далее по примеру можно добавить более гибкие настройки шаблона, а также неограниченное количество вкладок для удобства группировки настроек по смыслу.
Задать настройки шаблона нам поможет раздел config. Вот так выглядят параметры в админ-панели Joomla:
Тегом можно задать вкладки, внутри fieldset располагаем поля настроек. Рассмотрим, из чего состоят поля.
Значение по умолчанию (может отличаться в зависимости от типа поля):
Все типы полей можно посмотреть на официальном сайте Joomla.
Языковые переменные, о которых мы говорили выше, их необходимо прописать в файле ru-RU.tpl_universum.sys.ini для отображения в админке:
Если шаблон рассчитан только на русскоязычную аудиторию, то можно написать напрямую в значениях полей на русском языке.