ALLROUNDER от lernvid.com для joomla 2.5

Наконецто я добрался до раздела "шаблоны" и первым хотел бы представить один из лучших, на мой взгляд, бесплатных шаблонов - ALLROUNDER от lernvid.com. Шаблон имеет достаточно большое количество настроек внешнего вида, что позволяет придать сайту определенную индивидуальность. Так же есть множество позиций для модулей. Кроме того можно задать как фиксированную ширину в пикселях, так и указать в процентах. 

Вид шаблона по умолчанию:

Настройки шаблона (в админке):

Настройка ширины всего шаблона и отдельных колонок:

Настройка шрифтов:

Настройка логотипа:

Настройка цветов:

Настройка верхнего меню

При настройке можно воспользоваться всплывающими подсказками:

Немного о том, как и что изменить в шаблоне, если это не предусмотрено в админке.

 

1. Фон сайта - всей страницы (body)

Раз уж появился такой вопрос, распишу что да как. у себя менял уже давно, так что скачал шаблон по новой. 

Изначально в шаблоне есть как фоновая картинка для <body>, так и цвет. Цвет можно задавать в админке, либо оставить по умолчанию. Картинку можно сменить только слегка подправив css. 

Что бы не мучаться и долго не искать что и в каком файле изменять - воспользуемся стандартными средствами браузера (по аналогии можно будет менять стиль многих других элементов).

Я воспользуюсь opera dragonfly, хотя аналоги есть и в других браузерах. В контекстном меню находим "Проинспектировать элемент", либо идем в инструменты - дополнительно - opera dragonfly, либо (для windows) - ctrl+shift+i. В открывшейся панели находим блок, стиль которого хотим изменить. В данном случае - <body>

(кликните на изображение для увеличения - откроется в новой вкладке)

Здесь видим html код страницы в виде дерева, справа - стили выделенного блока, указано имя файла и строка (colors.css:7 - файл colors.css, седьмая строка). Расположен данный файл в /templates/allrounder-j1.6/css/colors.css

В данном примере в админке включено управление цветами, так что стилей вроде "jnvtest.httpmaster.ru/:5" не будет если цвета в админке берутся по умолчанию. 

Фон сайта задан в template.css, 11 строка (background-image: url("http://jnvtest.httpmaster.ru/templates/allrounder-j1.6/images/background.png");). Соответственно открываем данный файл и находим нужную строчку, выглядеть она будет так:

body {
font-family: Arial, Helvetica, Sans-Serif;
font-size:0.9em;
margin:0;
padding:0;
line-height:1.3em;
background-image:url('../images/background.png');
overflow-x:hidden;
}

Соответственно изображение будет находится в /templates/allrounder-j1.6/images/background.png  ("../" - возвращает нас на уровень вверх). Далее либо даем своему изображению такое же название, либо забрасываем его в этот же каталог и в css файле "background.png" меняем на название вашей картинки. 

 

 

т.к. сайт lernvid судя по всему уже не заработает, здесь ссылки на скачивание, 2 варианта - для j1.6-2.5 (скачать) и для j3 (скачать)

Скачивал уже со стороннего ресурса, на первый взгляд ничего лишнего не заметил, но проверить не помешает

Еще 4 материала, которые возможно Вам понравятся:

Добавить комментарий

Комментарии (56)

  1. Дмитрий 04 января 2016, 15:22
    Владимир, почему Вы не отвечаете?
    1. Владимир 04 января 2016, 18:14
      Не заметил сообщения… А где ошибка появляется? Можете скриншот прикрепить, или внести изменения и до завтра оставить — посмотрю.
      1. Дмитрий 04 января 2016, 23:46
        добавил код в файл template.css и сохранил на сайте, вот скриншот https://dropmefiles.com/KrzJm
        1. Владимир 05 января 2016, 03:43
          Как вижу, все работает. На ошибку эту просто внимания не обращайте…
          1. Дмитрий 05 января 2016, 08:42(Комментарий был изменён)
            незнаю как у Вас работает а у меня все на том же уровне https://dropmefiles.com/jpT8p, может это оссобенность браузера gchrome?
            1. Владимир 05 января 2016, 09:56
              Кеш в браузере почистить не помешает
              1. Дмитрий 05 января 2016, 10:44
                все получилось спасибо большое
    2. Дмитрий 17 декабря 2015, 14:05(Комментарий был изменён)
      Здравствуйте, помогите мне пожалуйста ещё раз с этим шаблоном=), а то уже несколько дней ковыряюсь не могу решить проблему(, вот мой сайт на нем ocreditah ru при наведении мышкой на табуляцию внизу: «вперед или назад» эта надпись дублируется в правой стороне экрана на фоне, не подскажите в чем здесь дело? Заранее большое спасибо.
      1. Владимир 18 декабря 2015, 06:02
        Здесь дело несовсем в этом шаблоне, а скорее в макетах плагинов и компонентов… та же ситуация и с формой обратной связи в контактах и некоторыми другими элементами. Добавьте в конце template.css следующий код и все должно быть нормально:
        .tooltip{position:absolute;z-index:1070;display:block;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:12px;font-style:normal;font-weight:400;line-height:1.42857143;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;word-spacing:normal;word-wrap:normal;white-space:normal;filter:alpha(opacity=0);opacity:0;line-break:auto}.tooltip.in{filter:alpha(opacity=90);opacity:.9}.tooltip.top{padding:5px 0;margin-top:-3px}.tooltip.right{padding:0 5px;margin-left:3px}.tooltip.bottom{padding:5px 0;margin-top:3px}.tooltip.left{padding:0 5px;margin-left:-3px}.tooltip-inner{max-width:200px;padding:3px 8px;color:#fff;text-align:center;background-color:#000;border-radius:4px}.tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}.tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-width:5px 5px 0;border-top-color:#000}.tooltip.top-left .tooltip-arrow{right:5px;bottom:0;margin-bottom:-5px;border-width:5px 5px 0;border-top-color:#000}.tooltip.top-right .tooltip-arrow{bottom:0;left:5px;margin-bottom:-5px;border-width:5px 5px 0;border-top-color:#000}.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-width:5px 5px 5px 0;border-right-color:#000}.tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-width:5px 0 5px 5px;border-left-color:#000}.tooltip.bottom .tooltip-arrow{top:0;left:50%;margin-left:-5px;border-width:0 5px 5px;border-bottom-color:#000}.tooltip.bottom-left .tooltip-arrow{top:0;right:5px;margin-top:-5px;border-width:0 5px 5px;border-bottom-color:#000}
        Отпишитесь помогло ли, добавлю в материал
        1. Дмитрий 18 декабря 2015, 14:08
          в самом конце просто вставить?
          1. Владимир 18 декабря 2015, 17:34
            можно в любом месте, но проще в самый конец
            1. Дмитрий 26 декабря 2015, 08:23(Комментарий был изменён)
              прошу прощения что так долго не отвечал, на работе завал(, на локальном сервере все получилось нормально вроде, а вот на хостинге beget как только добавил код высветилось предупреждение и написано:
              Don't use adjoining classes.
              Expected (left|right|center|justity|inherit) but found 'start'.
              и все на так же осталось
      2. Дмитрий 17 ноября 2015, 10:38
        Подскажите пожалуйста, как уменьшить отступ на наведенном пункте меню? (в меню с суфиксом класса модуля _menu который по умолчанию стоит в main menu к примеру, есть такая фишка что при наведении курсора на пункт меню он выделяется жирным и съезжает вправо, вот как уменьшить этот съезд вправо?)
        1. Владимир 17 ноября 2015, 11:27
          Подскажу, если дадите адрес сайта (у меня нет нигде этого шаблона установленного)
          1. Дмитрий 19 ноября 2015, 07:45(Комментарий был изменён)
            Спасибо большое, мой сайт ещё в разработке на локальном сервере, но хочу я сделать такой же отступ при наведении на меню как вот на этом сайте: naspinning ru видите там при наведении мышки на любой из пунктов правого меню он выделяется жирным и съезжает совсем чуть чуть вправо, а в стандартном шаблоне почти до середины меню.
            1. Владимир 19 ноября 2015, 10:02
              Откройте в каталоге шаблона — /js/effects.js, 5 строчка «jq(this).stop().animate({'padding-left':'20px'},{»
              1. Дмитрий 19 ноября 2015, 10:23
                Спасибо большое, все получилось, а как Вы узнали, что это меня меняется там? фаербаг это не показывает.
                1. Владимир 19 ноября 2015, 11:11
                  мм… отступ задан через js, а не css, это сразу видно. Дальше в каталог js шаблона, там по названию можно понять какой скрипт за что отвечает
                  1. Дмитрий 19 ноября 2015, 11:24
                    Большое спасибо
        2. Droid 12 октября 2015, 00:55
          Привет! вопрос по шапке шаблоне: как убрать фоновый цвет и фон под изображением логотипа.
          1. Вова Ленский 12 октября 2015, 09:30
            посмотрите в php/template_colors.php
            1. Droid 12 октября 2015, 15:02(Комментарий был изменён)
              не в той папке посмотрел. помогло частично. остался серый фон и бордюр. анадо чтоб фоновое изображение было видно shkola-internat10 ru
              1. Droid 12 октября 2015, 13:32
                Не помогает.даже полное удаление всех стилей.
                1. Владимир 13 октября 2015, 05:48
                  #header {
                  background-color: #<?php echo htmlspecialchars($this->params->get('headBgColor'));?>;
                  border-top:1px solid #<?php echo htmlspecialchars($this->params->get('headBorderColor'));?>;
                  border-left:1px solid #<?php echo htmlspecialchars($this->params->get('headBorderColor'));?>;
                  border-right:1px solid #<?php echo htmlspecialchars($this->params->get('headBorderColor'));?>;
                  }

                  вот эти стили сейчас для хедера применяются… остальное в css. Серый фон у wrapper
            2. Олег 23 марта 2015, 12:27
              Здравствуйте!Подскажите опять же горизонтальное меню.Никак не хочет выводится ни в headermodule1 ни выше.Только в position 1.
              1. Victor 14 марта 2015, 14:14
                Здравствуйте! Помогите в этом шаблоне сделать горизонтальное меню с ориентацией пунктов от центра
                1. Владимир 14 марта 2015, 17:04
                  как вариант - для #topmenu ul.menu li заменить float:left на display:inline-block; text-align:left;, затем для #topmenu ul.menu {text-align:center} - lvdropdown.css, где то 23 строка, или отступами..
                  1. Victor 17 марта 2015, 12:11
                    Спасибо! Сделал отступами.
                2. dsmem 11 февраля 2015, 03:14
                  Здравствуйте
                  А где эта тема хранит свои настройки ? (все что я менял в настройках шаблона (в админке))
                  1. Владимир 11 февраля 2015, 05:30
                    в БД, таблица template_styles (должно быть там)..
                  2. Adamast 09 февраля 2015, 16:28
                    [quote name="Владимир"]http://web.archive.org/web/20140216024211/http://joomla25.lernvid.com/ - вот здесь посмотрите. вот только не знаю, как долго вебархив данные хранить будет.. может перелить куда-нибудь.. надо подумать..[/quote]
                    Огромное спасибо, как я не догадался :-* дальше дело техники
                    1. Adamast 08 февраля 2015, 21:13
                      [quote name="Владимир"]Демоданных нет, но любые стили можно вытянуть из css.. или настроек.[/quote]
                      да но методом тыка ... а там было все расписано
                      [quote name="Владимир"]т.к. сайт авторов не доступен, добавил ссылки на скачивание шаблона[/quote]
                      спасибо, жаль что без демоданных :sad:
                      1. Владимир 08 февраля 2015, 21:48
                        http://web.archive.org/web/20140216024211/http://joomla25.lernvid.com/ - вот здесь посмотрите. вот только не знаю, как долго вебархив данные хранить будет.. может перелить куда-нибудь.. надо подумать..
                      2. Владимир 08 февраля 2015, 20:09
                        т.к. сайт авторов не доступен, добавил ссылки на скачивание шаблона
                        1. Adamast 08 февраля 2015, 16:25
                          не могу найти названия классов стилей этого шаблона может у кого остались демоданные .... сразу не переписал с демо сайта, а теперь он не доступен, а там помню красивые оформления встроенные
                          1. Владимир 08 февраля 2015, 19:51
                            Демоданных нет, но любые стили можно вытянуть из css.. или настроек.
                          2. Kolya 18 июня 2013, 19:34
                            ALLROUNDER Joomla 3.0.x ([url]"http://www.lernvid.com/attachments/article/370/allrounder-3_v1.1.zip"[/url])
                            ALLROUNDER Joomla 1.6.x | Joomla 1.7.x ([url]"http://www.lernvid.com/attachments/article/370/allrounder-j1.6_v1.1.zip"[/url])
                            ALLROUNDER Joomla 2.5.x ([url]"http://www.lernvid.com/attachments/article/370/allrounder-j1.6_v1.4.zip"[/url])
                            1. Александр 18 июня 2013, 20:54
                              Спасибо за ссылки...!!!! На оф сайте уже скачал :) Только вот немогу найти архив с демо данными:( Може подскажешь где взять?:)
                              1. Владимир 19 июня 2013, 10:31
                                я так понимаю, архив с демо данными жумлы? могу сбросить sql файл.. или как вариант - установить свежую жумлу с демо данными и на ней экспериментировать...

                                ps. все бесплатное лучше скачивать с оф. сайта. Гарантия отсутствия лишних ссылок (кроме разработчика) и других возможных неприятностей.
                                1. Александр 19 июня 2013, 12:44(Комментарий был изменён)
                                  Сайт с шаблоном и материалами, меню и т.п. Как на демо шаблона joomla25.lernvid.com/
                                  1. Владимир 19 июня 2013, 13:09
                                    так а у вас на сайте есть какое-либо содержимое?
                                  2. Александр 19 июня 2013, 10:42
                                    На оф сайте только чистый шаблон, а мне хотелось установить сразу демку и уже ее править
                                    1. Владимир 19 июня 2013, 11:54
                                      имеются ввиду настройки шаблона, либо сайт с шаблоном и материалами, меню и т.п.? Пока не совсем понимаю проблему..
                                      1. Александр 19 июня 2013, 10:46
                                        пидимо этот разработчик не пожелал предоставить демо
                                2. Александр 18 июня 2013, 14:48
                                  А скачать его здесь можно?)) Или на других сайтах искать?
                                  1. Александр 18 июня 2013, 13:56
                                    А счачать его здесь можно?)) Или на других сайтах искать?
                                    1. Владимир 05 мая 2013, 19:40
                                      Рад помочь ;)
                                      1. Александр 05 мая 2013, 17:07
                                        Отличный шаблон!
                                        Подскажите пожалуйста, как изменить высоту кнопок меню? Зарылся в css и что-то не нашел как это сделать, не очень шарю просто)
                                        1. Владимир 05 мая 2013, 18:42
                                          А каких именно кнопок... боковое меню, или верхнее?
                                          1. Александр 05 мая 2013, 18:46
                                            Интересует верхнее меню)
                                            1. Владимир 05 мая 2013, 18:57
                                              В lvdropdown.css (вероятно, строка 28.. #topmenu ul.menu li a, ), свойство "padding". Это поля для тега "a" в верхнем меню, увеличивая их можно увеличить и высоту кнопок. Не скажу наверняка какое там значение по умолчанию.. так что для примера. {padding:5px 4px} - означает, что снизу и сверху поля будут по 5 пикселей, слева и справа - по 4 пикселя.. как то так. На мой взгляд - наилучший вариант.
                                              1. Александр 05 мая 2013, 19:35
                                                Класс! Спасибо огромное, все получилось:)
                                        2. Владимир 11 апреля 2013, 10:48
                                          немного дополнил статью.. будут вопросы - задавайте :-)
                                          1. Алексей 11 апреля 2013, 07:56
                                            Шаблон скачал, установил. Работаю на Денвере.
                                            1. Владимир 11 апреля 2013, 07:34
                                              по умолчанию здесь в админке только цвета меняются.. если нужна именно картинка, нужно вносить изменения в css. Сегодня вечером (а может и раньше, как время будет) скажу что и где менять.. нужно будет еще скачать шаблон, т.к. здесь он уже переделан и некоторые изменения внесены ранее..
                                              1. Алексей 08 апреля 2013, 14:44
                                                Да, шаблон хороший. Пытаюсь на нем сделать сайт. Подскажите свой опыт или материалы в сети как изменить фоновый рисунок "body" Спасибо!