Дизайн на формата за публикувате на коментари

Здравейте, приятели. Скоро ви предложих вариант за промяна в дизайна на формата за коментар в блога. Вероятно вече сте я прочели. Днес реших да споделя с вас как да променим дизайна, външния вид на формата за публикуване на коментари в блога. Ще се разграничим от стандартната версия на този прозорец и ще го направим много по-привлекателен. Вероятно и вие сте на моето мнение, че формата за публикуване на коментари в Blogger изглежда доста скучна.

Предлагам три лесни варианта, за да има избор, ако искате да промените нейния външен вид. С помощта на много малки CSS кодове ще можете да промените дизайна на формата за публикувате на коментари така, че да отговаря на общия дизайн на вашия блог.

Вариант първи

Почти нищо не променяме, а само добавяме сянка.

Кодът е:

#comment-editor{background:#ffffff;repeat-x;border:1px solid #ddd;

-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;

box-shadow: 5px 5px 5px #CCCCCC;

padding:5px;width:580px; height:234px !important;}

Какво е възможно да промените в този код:

➤Всичко, което е оцветено в синьо,

box-shadow: 5px 5px 5px #CCCCCC; 

е редът в кода, който отговаря за размера и цвета на сянката;

➤Оцветеното в зелено отговаря за заоблянето на ъглите на цялата форма;

Вариант втори

Ако променим в кода на първия вариант стойността на фона background #ffffff; на background: # 2288bb; ще имаме съвсем различен дизайн.

Вариант трети:

Да продължим да си "играем" с кода. Вместо фон да вмъкнем изображение и да променим цвета на рамката. Ето това се получава.

Кодът е:

#comment-editor{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy1Y3nKTnAgF_7Px2CPZY_c79PoyTD21Nt7FloCSBqcylp8dD-FoTzp_dUzlPhs2V7Y8DnlNkS1nljq83LGehwbylmpx2cno1UvwzV_lHcm251frLOtzc31ggjAxkJ-KVofvtTWu7nuUqR/w140-h105-p/flowers1.jpg) ;repeat-x;border:2px solid #336633;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;box-shadow: 5px 5px 5px #CCCCCC;padding:5px;width:580px; height:234px !important;}

Ако не искате сянка, то премахнете от кода следния участък:

box-shadow: 5px 5px 5px #CCCCCC;

и вече ще имате друг дизайн на формата за изпращане на коментари.

Ширината 580px може да се регулира в зависимост от ширината на полето за коментар на вашия шаблон. Височина: 234px не трябва да се променя към по-малка. В противен случай може да получите лента за превъртане. Но ако това не ви пречи можете да експериментирате.

Когато всичко това е променено според вашето желание направете следното:

копирате кода ➔ отидете на Тема ➔  промяна на HTML кода ➔ намерете реда ]]></b:skin> ➔ поставяне готовия код пред него ➔ запаметете.

Готово. А сега се насладите на това, което сте създали.

Мисля, че ако оформите така прозореца за публикуване на коментари би било хубаво. Опитайте сами. Можете да украсявате по този начин блога си, да освежите неговия дизайн за всеки повод, като избирате подходящо фоново изображение.

Здраве за всички вас! Не забравяйте да правите добро на други хора!

Ще съм благодарна да оцените моя труд и кликнете върху звездичките по-долу. Или гласувайте за блога на: