Оформление гаджета Опрос Blogger в индивидуальном стиле

---

Оригинальное оформление родного гаджета создать Опрос

Здравствуйте гости и читатели моего блога. Сегодня будем оформлять на свой вкус и цвет родной гаджет 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 (адрес изображения);

Остальные настройки те же, что и в первом варианте.

Вот пока и все. Оформляйте, пишите отзывы, не забывайте делиться с друзьями и знакомыми в социальных сетях. Всем всего Доброго, до новых встреч.

Почитайте по теме: 

• Как самостоятельно создать и красиво оформить простое меню для блога; 
• Как скопировать не копируемый код;