Дизайн гаджета ярлыки в BLOGGER.

Приветствую всех на своём блоге. Вот  люблю блоггеровский шаблон за то, что он достаточно гибкий в настройках. Из всех предложенных гаджетов можно с помощью небольших изменений и дополнений, придать совсем уникальный вид тому или иному элементу блога. При этом, не прибегая к установке сторонних кодов.

Например, как изменить родной гаджет постоянные читатели уже разобрались в этой шпаргалке. И совсем недавно изменили внешний вид гаджета подписки на Email. Кто пропустил это сообщение, прочитайте здесь. Сегодня опять хочу предложить вам шпаргалку о том, как изменить внешний вид виджета ярлыки.

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

Вариант1. 

Это код для него

#Label1 a{
color:#FFFFFF;
padding:10px 15px;
line-height:35px;
margin:0 -2px;
border:1px solid #ddd;
border-radius:0px;
font-size:11px !important;
text-decoration:none;
text-transform: uppercase;
background-color: #0053CE;
font-weight: 900;
list-style-type: none;
}#Label1 a:hover{
color:#FFFF00;
text-decoration:none;
background-color: #000099;border-radius:15px;
}

Вариант 2. Его мы можете посмотреть у меня в боковой колонке блога.

Это его код.

.label-size a { margin:0 4px 6px 0; padding: 5px; text-transform: uppercase; border: solid 1px #C6C6C6; box-shadow: 1px 1px 2px #333 inset; border-radius: 3px; float:left; text-decoration:none; font-size:10px; color:#990000; font-family: Verdana, Arial, Helvetica, sans-serif; background-color: #E1E1E1; } .label-size a:hover { border:1px solid #990000; text-decoration: none; -moz-transition: all 0.7s ease-out;  -moz-transform: rotate(7deg); color: #333; background-color: #FFFFFF; box-shadow: 1px 1px 2px #333; }

Ну, а теперь, как всё это реализовать. Наверняка у вас уже установлен такой гаджет. Для новичков скажу, как это сделать. Вкладка дизайн-добавить гаджет и из предложенных вариантов выбираем -ярлыки. Сразу заострю ваше внимание, что коды, предложенные выше работают если выбран стиль ОБЛАКО. При варианте СПИСОК они не подходят.

Если вы определились и хотите так же изменить внешний вид этого гаджета, копируйте один из кодов в блокнот или черновик, меняйте цветовые значения на свои. Я выделила их разным цветом. Надеюсь, что с этим проблем не будет. Затем заходим во вкладку шаблон, изменить HTML и перед строкой ]]></b:skin>вставляете свой код.

 В некоторых шаблонах есть более удобный путь. Так же вкладка шаблон-настроить-дополнительно-добавить CSS. Справа, в открывшемся окне добавляем код и сохраняем. Он сам автоматически установится в шаблоне блога. Проверьте на всякий случай эту функцию у себя.

После установки кода, непосредственно в шаблон, обязательно нажмите просмотреть шаблон и убедитесь, что всё получилось. Не забудьте сохранить. Остаётся только зайти посмотреть блог и порадоваться новому дизайну гаджета ярлыки. Или как вы его назвали. И если вы с этим справились, я тоже порадуюсь, что пост оказался для вас полезным.

И на сегодня всё. Заглядывайте.

оформите подписку на новые шпаргалки

введите пожалуйста свой адрес электронной почты :