Как создать кнопку, изменить фон и картинку в модуле

6 года 11 мес. назад - 6 года 11 мес. назад #676 от benjamin5000
Всем привет!
Сильно не пинать, ибо 3-ий день знаком с joomla.
Ситуация следующая.
На хостинг залил joomla 1.6 и установил шаблон. Демо см тут: demo.gavick.com/joomla15/dec2010/
у же немного разобрался как делать меню и создаввать модули.
Сейчас необходимо сделать на моем сайте такие же модули как и в демке..
а именно:
1)такую же надпись как и в демке Get in touch +48 800 801 5577. Саму надпись размещаю, то не понимаю как сделать эту желтую рамку вокруг

2)такой же модуль С КНОПКОЙ как и в демке где написано Email marketing that is Powerful, Easy and Fun! и большая зеленая кнопка SIGN UP FREE (как сделать кнопку??)

3) Как поменять цвет фона у одного из модулей(например в демке модуль с желтым фоном и тремя картинками)

Помогите пожалуйста.

Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.

6 года 11 мес. назад #680 от VARion
1) для блока нужно добавить следующий CSS стиль:
...... {
border: 2px solid #FADB7C;
-moz-border-radius: 6px 6px 6px 6px;
background: none repeat scroll 0 0 #FFFFFF;
padding: 18px;
}

2) и 3) похожи в настройке: нужно изучать CSS.

Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.

6 года 11 мес. назад #681 от benjamin5000
1) Где искать этот блок, что это такое и как добавить туда(к нему) css стиль? :whistle:
2) Можно по подробнее?

Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.

6 года 11 мес. назад #683 от VARion
Например так:
1) Создаёшь модуль типа Custom-Html (Произвольный Html-код) (Менеджер расширений -> Менеджер модулей) и в содержимом добавляешь код:
<div class="orangeborder">
	<div class="moduletable_content">
        Get in touch<br>
	<h1 style="margin: 4px 0pt 0pt; line-height: 100%;">+48 800 801 5577</h1>              
	</div>
</div>
orangeborder - это имя класса, для него в основной CSS-файл текущего шаблона (template.css) добавляем CSS стиль (можно в самый конец файла, ПРЕДВАРИТЕЛЬНО СДЕЛАВ КОПИЮ ЭТОГО ФАЙЛА:
.orangeborder {
border: 2px solid #FADB7C;
-moz-border-radius: 6px 6px 6px 6px;
background: none repeat scroll 0 0 #FFFFFF;
padding: 18px;
}
Смотрим что получилось.

Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.

6 года 11 мес. назад - 6 года 11 мес. назад #684 от benjamin5000
Сделал немного другим способом. Через суфикс класса.
С фоном модуля думаю так же бороться.
А как сделать кнопку???

Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.

6 года 11 мес. назад #691 от VARion

benjamin5000 пишет: А как сделать кнопку???

Здесь всё просто: в статье или модуле должна быть ссылка типа
<a href="#" class="buttonGreen">Sign Up Free!</a>
И к ней соответсвующий CSS-стиль, в котором прописано фоновое изображение buttonGreen.png:
a.buttonGreen {
    background: url("../images/buttonGreen.png") no-repeat scroll 0 0 transparent;
    color: #FFFFFF;
    display: block;
    float: right;
    font: bold 22px/58px Arial,Helvetica,sans-serif;
    height: 58px;
    margin: 5px auto 0;
    padding: 0 0 0 17px;
    text-transform: uppercase;
    width: 245px;
}

Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.

6 года 2 мес. назад #2874 от Сергей11
Добрый день скажите пожалуйста как изменить фон только одного модуля?

Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.

6 года 2 мес. назад #2875 от VARion
Сергей, добавляете суффикс модуля " myModule" (пробел оставьте): Суффикс класса модуля или как сделать каждый модуль Joomla уникальным

А дальше добавляете стиль, вроде этого:
.myModule {
    background: url("../images/background.png") no-repeat scroll 0 0 transparent;
    color: #FFFFFF;
}

Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.


Вверх