Как сделать сайт самому на Joomla
Бесплатная, мощная и безопасная, легка в освоении и имеет почти бесконечное множество как бесплатных, так и платных дополнений: модулей, плагинов, шаблонов и других незаменимых вкусностей – идеальный выбор для разработчика сайта с любым уровнем опыта.
Почему выбор пал именно на данную CMS? Создание сайта на Joomla – эффективное достижение гарантированного результата неограниченного уровня сложности, будь то функциональный интернет-магазин, несложная в исполнении визитка-портфолио или, например, новостной сайт.
Инструкция позволяет легко и быстро освоиться со всеми этапами создания от 0% до почти готового результата – требуется лишь минимальный уровень знания ПК и наличие некоторого количества свободного времени и усердия. А скриншот ниже – подстегнет желание! Именно это можно получить на выходе, если приложить чуточку старания.
Подготовка к установке Joomla
Как известно, самое сложное в любом деле – это начало. Однако «Джумла» радует крайней нетребовательностью: достаточно лишь раз выполнить описанную ниже последовательность действий — и данный этап больше не заставит вспоминать о себе, позволяя полностью сосредоточить внимание непосредственно на сайте, контенте, дизайне и продвижении!
В первую очередь, надо скачать joomla дистрибутив, который располагается по адресу (для joomla 2.5): http://joomla.ru/downloads/joomla
Но уверены ли вы, что знаете, как сделать сайт самому, да такой – чтобы не стыдно было сразу выложить в интернете.
Рекомендуется воспользоваться помощью поистине бесценной программы « Denwer », которая позволяет создавать локальный сервер и просматривать сайты исключительно в пределах вашего компьютера, благо установка занимает всего считанные минуты. Скачать Денвер можно с официального сайта: http://www.denwer.ru
В случае появления любых недоразумений или неодолимой жажды знаний — на сайте также имеются подробные видео-уроки. Однако это уже не касается основной задачи: пройти инструкцию-обучение и усвоить, как сделать сайт с нуля на joomla.
Установка Joomla на локальный сервер
Скачали и установили все требуемые файлы? – Тогда переходим к столь долгожданному и самому интересному этапу обучения — к раскрытию ответа на волнующий вопрос, как сделать свой сайт бесплатно. Открываем папку « home » (по умолчанию C:WebServershome ) и создаем папку с названием сайта, например: « site.ru ». Внутри созданной папки создаём ещё одну, с именем « www » — и распаковываем туда скачанные исходники Joomla. Сравниваем полученный результат с примером на скриншоте.
Откроется страница, где наша задача: найти строку « phpMyAdmin — администрирование СУБД » — кликаем. Откроется страница, откуда можно перейти через левую верхнюю вкладку по адресу «База данных». Внимательно прописываем латинскими буквами выбранное название сайта ( site ) и кликаем « создать ». Поздравляем! – База данных, необходимая для работоспособности сайта, создана.
Следуйте указаниям инструкции – данный этап не скрывает в себе сложностей. Отныне вы знаете, как сделать сайт на joomla!
Вбивайте в адресную строку название сайта и можете любоваться полученным результатом. Для управления сайтом пройдите по ссылке (потребуется логин и пароль, указанные в процессе установки, как показано на скриншоте): http://site.ru/administrator
Установка шаблона сайта на Joomla
CMS установлена, вход в администраторскую панель осуществлен: продолжаем раскрывать таинство темы, как сделать сайт бесплатно. В нашем случае стандартный шаблон заменен новостным « ZT_News_III », содержащий бонус: « ZT_News_III_template », « Plugin_System_ZT_Mega_Menu », а также дополнительные модули. Для установки необходимо скачать файлы на компьютер, разархивировать и найти в панели управления вкладку «Расширения – Установить/Удалить».
Предложенный вариант шаблона – далеко не единственный! На просторах сети имеется необозримое множество платных и бесплатных шаблонов. Экспериментируйте! Единственная рекомендация – использовать проверенные источники, в частности – с официальных сайтов. Интересует, как добавить шаблон? Кликаем « Выберите файл », находим архив шаблона на компьютере и нажимаем « Загрузить файл и Установить ».
Настройка Joomla
Настройка шаблона и модулей
Настройка Joomla начинается с настройки компонентов.
Главное в настройке джумлы – это настройка компонентов. Для активации плагинов и модулей переходим по адресу « Расширения – Менеджер плагинов/модулей ». Контролируем, чтобы рядом с каждым нужным пунктом была установлена галочка.
Далее следует задействовать установленный шаблон сайта. Переходим в « Расширения – Менеджер шаблонов » и выбираем имеющийся (в нашем случае « ZT_News_III_template ») – устанавливаем по умолчанию. Преобладающее количество качественных шаблонов обладает собственными настройками, в частности, различными цветовыми гаммами (у нас зелёная, серая и красная).
Что касается прилагаемых модулей, то имеется следующий ассортимент:
Любой из вышеперечисленных модулей свободно редактируется в разделе « Расширения – Менеджер модулей ». Переходим на сайт « выбранное название сайта » и наслаждаемся полученным результатом! Вы уже убедились, что сделать сайт самому бесплатно – легко и быстро?
Настройка сайта
Крепкий фундамент – залог удивительной долговечности дома. Следует покопаться в глобальных настройках сайта сразу же — позднее что-либо менять на глобальном уровне будет крайне хлопотно! Находятся они в разделе « Сайт – Глобальная конфигурация », разбиваясь на три подраздела: « Сайт », « Систем а», « Сервер ».
Чуть правее располагаются настройки SEO:
Система и Сервер — отвечают за настройки более глубокого уровня, поэтому при отсутствии опыта рекомендуется ничего не трогать, лишь просмотреть для справки. Меняются они на более поздних этапах по мере получения опыта работы.
Начало работы с Joomla
Пока информация не добавлена – шаблон выглядит пустым и унылым. Чтобы сделать свой сайт конкурентоспособным, привлекающим всеобщее внимание – наполняйте его качественным и уникальным, интересным для пользователей контентом.
Прежде, чем добавлять записи, нарисуйте структуру сайта:
В разделе « Содержание » находятся менеджеры для редактирования каждой составляющей структуры. Начнем с разделов: переходим во вкладку « Содержание – Менеджер Разделов », в правом верхнем углу выбираем « Новый » — создаем раздел.
Заполняем поля «Название» (указываем название раздела на русском языке) и «Псевдоним» (название на латинице, рекомендуется транслитерация). Для автоматической транслитерации слов существует весьма удобный (достаточно ввести текст на русском языке, чтобы мгновенно получить его же, но английскими буквами) онлайн-сервис translit.ru – рекомендуется к использованию!
Проверяем, отмечена ли публикация (должно быть «да») — и нажимаем кнопку « Сохранить » в правом верхнем углу.
Можете полюбоваться, как будет выглядеть сайт после появления первых нескольких статей. Прекрасно, не правда ли.
А теперь – вперёд! На покорение новых вершин. Постойте… а вдруг у вас не получилось? Тогда специально для вас предлагается альтернативный вариант! Вы можете выбрать лучший онлайн конструктор сайтов в нашем обзоре или воспользоваться уникальным конструктором Wix – настолько простой, что абсолютно не требует даже базовых знаний.
Конструктор Wix – комплексное решение для ценящих собственное время людей и всех тех, кого по какой-либо причине не привлекла Joomla.
Как создать сайт на Joomla с нуля. Инструкции + видео.
Рассмотрим как сделать сайт, из каких этапов состоит разработка сайта на Joomla и сколько денег нужно чтобы его создать.
Содержание:
Это могут быть:
Этапы разработки для каждого типа сайта практически одинаковы.
Давайте их рассмотрим.
Установка Joomla
Для начала нужно познакомиться с системой и установить её.
Скачать последнюю версию можете с официального сайта >>
Установка может проивзодится как сразу на хостинг в интернете, так и на свой компьютер (для этого нужна специальная программа, которая сделает из вашего домашнего компьютера локальный сервер, называется OpenServer).
Если вы не знакомы с Joomla, то рекомендую установить её на локальный сервер.
Установка самого сервера и Joomla довольно простые, посмотрите весь процесс в видеоролике:
Знакомство с админкой и базовые настройки
Всё управление сайтом происходит через административную панель.
Вход в неё всегда такой ваш_сайт.ru/administrator
Создание категорий и статей.
В материале Joomla размещаются такие типы контента:
Теперь определимся с будущей структурой вашего сайта и создадим предполагаемые категории.
Как создать категории Joomla >>
Далее пробуем создать несколько материалов. Необязательно создавать сразу все, можно создать только самые необходимые.
Это зависит от типа сайта, который вы разрабатываете.
Прим.: тексты для сайта вы можете писать самостоятельно или заказывать на специальных биржах.
Стоимость статьи получается примерно от 50 рублей за 1000 символов
Для создания материалов используется специальный визуальный редактор, он упрощает работу вебмастеру.
Создание меню в Joomla и типы пунктов
Когда структура сайта намечена и вы написали несколько статеек, то пришло время вывести их на сайте.
Вывод контента происходит через пункты меню.
Они бывают разных типов и через них выводятся разные элементы.
Например, пункт меню с типом категория Список, выводит все материалы выбранной категории в виде списка.
А тип меню Блог категории, выведет материалы выбранной категории уже в виде блога.
Т.е. это будет вступительный текст с картинкой и кнопка подробнее.
Дополнительные функции
В стандартной сборке Joomla уже присутствует много базовых функций.
Это например: поиск по сайту, форма обратной связи, баннеры, ленты новостей, метки и многое другое.
Это родные расширения Joomla.
Все расширения делятся на типы: модули, плагины и компоненты и т.д.
Выполняют основную логику работы, например компонент интернет магазина.
Дополняет Joomla возможность создать полноценный интернет магазин.
Вся информация из компонента выводится в основной колонке сайта.
Выводят информацию в боковых колонках и других позициях шаблона.
Можно назвать их виджетами.
Выполняют простую работу по выводу информации на сайт.
Например модуль входа (авторизации) выводит форму для ввода логина и пароля.
Их можно назвать «примочками», например, плагин авторизации по e-mail.
После его включения, пользователи сайта могут заходить не только под своим логином, но и под своим email’ом.
Или плагин рекапча от Google, он помогает защищать формы от спам ботов.
Также ещё есть шаблоны, языки и пакеты.
Они тоже считаются расширениями.
Как вы, наверное, уже поняли, есть стандартные расширения, которые создаются разработчиками Joomla.
И есть сторонние расширения, которые создаются другими разработчиками и веб-студиями.
Как раз при помощи сторонних расширений функционал Joomla можно значительно расширить.
Некоторые шаблоны иногда содержат дополнительные модули.
Существуют так называемые квикстарты (quickstart).
Это чистый сайт на Joomla (с демо данными) с полностью настроенным шаблоном.
Это удобно, когда времени на разработку и настройку совсем нет.
Прим.: расширения могут быть платные и бесплатные.
Бесплатных, на мой взгляд больше. Часто разработчики создают два или три варианта одного расширения.
Первый вариант, самый простой с базовым набором функций бывает бесплатным.
А варианты с продвинутыми функциями уже бывают платными.
Совет: никогда не скачивайте расширения с торрентов или складчин.
Вы рискуете безопасностью вашего сайта.
В таких «неофициальных» расширенияих, в большинстве случаев содержится вредоносный код, а иногда даже вирусы.
Используйте только те расширения, которые вы скачали или приобрели у их официальных разработчиков.
Тогда вы можете скачивать их обновления и получать техническую поддержку.
Перенос сайта на хостинг
После установки и настройки дополнительных расширений сайт ещё раз осматривается, проверяются его страницы и работа всех его функций.
Далее регистрируется доменное имя и сайт переносится на хостинг в интернет.
Хостинг это техническая площадка (сервер), который постоянно подключен к интернету.
На одном сервере могут размещаться сотни сайтов.
Хостинг тоже делится по типам.
Домен можно регистрировать там же где арендуете хостинг, а можно регистрировать напрямую у регистратора доменов.
Напрямую лучше, потому что есть быстрый доступ к настройкам домена.
Процесс переноса сайта.
Первоначальная настройка сайта на хостинге
После того как ваш сайт заработает на хостинге, производится его начальная настройка:
Поздравляю! Ваш сайт в интернете.
Теперь ждём когда поисковые системы проиндексируют сайт и он появится в результатах поиска.
На это уходит примерно неделя-две.
SEO оптимизация
Поэтому нужно оптимизировать сайт под требования поисковых систем, чтобы они выводили его на первых позициях по нужным вам запросам.
Тема SEO очень большая, охватить её одним абзацем невозможно.
Поэтому рекомендую вам книгу «Секреты SEO для новичка».
Дам пару советов.
Всё это будет учитываться поисковыми системами и они будут лучше к вам относится.
А мы поможем вам советами, видеоуроками,хорошими расширениями и шаблонами для Joomla.
Сколько нужно денег чтобы создать свой сайт с нуля?
Сумма зависит от того насколько быстро вы хотите сделать свой сайт.
Обязательные расходы:
Итого получается около 200 рублей.
Чтобы создать свой сайт по нашим инструкциям, вам нужно всего 200 рублей!
Дополнительные расходы (при желании):
А чтобы сделать сайт правильно и быстро, вам нужно всего около 3-4 тысяч рублей.
Решение за вами!
Рекомендую посмотреть наши онлайн курсы >>
А с чего же начать создание сайта?
Ответ в этом видео.
Готовые сайты
Скачать Joomla
CMS для онлайн школ
Мощная система для создания онлайн школ и дистанционных уроков.
Удобно: всё в одном месте!
Уроки + задания, мембершип и платный доступ, рассылка и приём оплаты.
+ Тест драйв на 14 дней
Новое на сайте
ИП Касьянов О.А. | ОГРН 314732807000062 | +79176096411
Создаем свой шаблон для 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 для отображения в админке:
Если шаблон рассчитан только на русскоязычную аудиторию, то можно написать напрямую в значениях полей на русском языке.
Файл index.php
В этом файле и будет вся наша верстка будущего сайта, в который мы добавим вывод наших настроек и обязательных параметров Joomla для корректной работы сайта.
Первой обязательной строчкой php файла является следующее выражение:
Далее нужно передать параметры в шаблон следующим образом:
Затем передаем сами параметры и записываем в переменные – на примере title, description и лого:
Начало файла шаблона index.php:
Продолжаем наполнение шаблона, дальше следуют стандартные блоки html. Код приведен ниже:
Далее в теге body вы вставляете свою верстку, а в места для контента – специальные переменные для вывода контента из админки по позициям, которые мы описывали выше в файле xml.
В остальных папках и файлах содержится наша верстка, и у каждого она своя.
Файл error.php
Имеет смысл рассмотреть еще файл error.php – в нем мы показываем, как должна выглядеть страница 404, у меня он такой (также можно «подхватить» все параметры из настроек шаблона – все зависит от фантазии и верстки страницы):
Вот и все, минимальный набор для установки шаблона готов!
Установка шаблона
Заходим в административную панель Joomla и устанавливаем наш шаблон:
Выбираем наш шаблон по умолчанию и переходим на сайт, чтобы убедиться, что все работает:
Для примера прикрепляю к статье свой шаблон. Вы можете установить его и посмотреть на внутреннюю «кухню», а также задать вопросы в комментариях.