Оригинальное оформление родного гаджета создать Опрос
Здравствуйте гости и читатели моего блога. Сегодня будем оформлять на свой вкус и цвет родной гаджет Google-Создать Опрос. Отвлекусь немного от темы: настоятельно Вам советую, если есть возможность пользоваться родными гаджетами Google, непременно воспользуйтесь этим и вот почему.
В кодах всяких разных красивых виджетов, которые мы с увлечением добавляем в тело шаблона и в боковые панели, автор часто дает ссылку на свой ресурс. Вебмастерам, кто только начинает вести блоги, и не сильно разбирается в HTML кодах, сложно найти и правильно удалить её.
Я тоже не большой специалист в HTML кодах, но для своих читателей стараюсь по возможности удалять все лишние ссылки. Так же как и все, напихала в шаблон разных красивостей, а когда проверила свой блог на битые ссылки, у меня наступил шок. Две недели мне понадобилось, чтобы очистить свой блог. Ссылок было полно в основном в теле шаблона. Что значат битые ссылки в блоге, читайте в моем посте как найти и исправить битые ссылки в блоге.
Это еще повезло, что ссылки без вирусов, а так даже не хочу и думать, что могло бы быть. А теперь давайте вернемся к нашей теме, и я расскажу как можно оформить гаджет опрос с использованием стилей CSS.
Для начала давайте добавим гаджет опрос в макет блога. В дизайне нажимаем добавить гаджет, находим Опрос
Создаете нужный опрос, нажимаете сохранить. Далее в черновике blogger нажимаем шаблон. Обязательно делаем резервную копию шаблона. Далее нажимаем изменить шаблон и рядом с первой стрелкой находим строку <b:skin>...</b:skin>.
Нажимаем на стрелку, прокручиваем не спеша вниз и выше строки ]]></b:skin вставляем код CSS, который Вы видите ниже
/* Sidebar Content */
#Poll1{
background:#03b4cc;
border:2px dotted #ffffff;
width:auto;
padding:0 10px;
}
#Poll1 h2{
text-align:center;
font-size:11px;
color:#ffffff;
font-family:arial;
font-weight:bold;
}
При настройке возникнут небольшие неудобства. При просмотре в шаблоне блога, содержание гаджета не будет отображаться при соединении. Поэтому придется настраивать в "темную". Но окантовку рамки и фон Вы видеть будете.
Выделенное красным-ID гаджета Опрос. Если будете создавать несколько опросов, то ID будет такой: Poll2, Poll3 и.т.д; синим-фон гаджета; оранжевым-форма, цвет и размер границы рамки; голубым-ширина гаджета. У меня настроено на автоматическую ширину, но Вы можете регулировать ширину своего виджета, измените auto на 150px к примеру;
Вторая часть-это настройка заголовка гаджета. Потребуется в том случае, если захотите, чтобы заголовок опроса отличался от заголовков других гаджетов. Выделенное фиолетовым-текст выровнен по центру, размер шрифта 11 рх, цвет белый; лиловым-семейство шрифтов Arial жирный.
А теперь смотрим, что мы можем получить
Сами понимаете, на скриншотах вид не всегда впечатляет, я всего лишь хочу показать, как можно красиво изменить гаджет.
Вместо цветового фона можно вставить картинку, тогда получим гаджет в таком оформлении:
В коде вместо background:#03b4cc; вставьте background:url (адрес изображения);
Остальные настройки те же, что и в первом варианте.
Вот пока и все. Оформляйте, пишите отзывы, не забывайте делиться с друзьями и знакомыми в социальных сетях. Всем всего Доброго, до новых встреч.
Почитайте по теме:
Почитайте по теме:
Рекомендуемый контент:
Оля, привет.Очень красивая форма получилась. Я никак не могу до неё добраться. Пока не знаю куда и какую ставить. Столько всего можно. кто бы времени добавил. Кстати очень лёгкая форма получается. А битые ссылки-проверять только успевай.
ОтветитьУдалитьЗдравствуй Вика. А прямо сейчас возьми и создай опрос, не откладывай на потом. Времени нам всем катастрофически не хватает-это факт. Что касается битых ссылок, только избавилась от них. Вчера проверяла-по нулям в обоих блогах. Но проверять надо чаще, согласна с тобой.
Удалить