Днес търсих начин да направя на един мой сайт изкачащ прозорец на главната страница. Сайта се задвижва с blogspot. Ровейки по нета, попаднах на една статия където е описано много добре кои са стъпките за да направете изкачащ прозорец за блог в Blogger и искам да го споделя.
Изкачащия прозорец съдържа съобщение, снимка, facebook like box, или какво си пожелаете, като се показва само един път на първата страница, веднага след зареждането и, без да става досаден като продължите да разглеждате в сайта.
Ето и кода :
Инсталирай java script
1. Логни се в Blogger акаунта си. Иди в Template tab, и запази действащата ти кожа на компютъра. Ако нещо се провали винаги ще можеш да си възвърнеш работещия ти блог от този бекъп.
2. Клик на Edit HTML и потърси за този таг (Ctrl+F). После добави следния код ПРЕДИ този таг
If you are familiar with Java Scripts, The comments marked with Red color is for you.
CSS Code След като добавиш кода Java script, потърси за този низ ]]> и ПРЕДИ него добави следното:
#popupContactClose{
cursor: pointer;
text-decoration:none;
}
#backgroundPopup{
display:none;
position:fixed;
_position:absolute; /* hack for internet explorer 6*/
height:100%;
width:100%;
top:0;
left:0;
background:#000000;
border:1px solid #cecece;
z-index:1;
}
#popupContact{
border-top:5px solid #53A9FE;
border-left:5px solid #53A9FE;
border-bottom:5px solid #53A9FE;
border-right:5px solid #53A9FE;
border-radius:30px;
-moz-border-radius:30px;
-webkit-border-radius:30px;
display:none;
position:fixed;
_position:absolute; /* hack for internet explorer 6*/
height:384px;
width:408px;
background:#FFFFFF;
z-index:2;
padding:12px;
fo
nt-size:13px;
}
#popupContact h1{
text-align:center;
color:#6FA5FD;
font-size:22px;
font-weight:700;
border-bottom:1px dotted #D3D3D3;
padding-bottom:2px;
margin-bottom:20px;
}
#popupContactClose{
font-size:14px;
line-height:14px;
right:6px;
top:4px;
position:absolute;
color#A30101;
font-weight:700;
display:block;
}
За да се покаже изкачщия прозорец
Можеш да добавиш каквото пожелаеш в popup box.
Кодът трябва да влезе преди tag.
PopUp Заглавие
ТУК пишеш това което искаш да се покаже в изкачащия прозорец.
Замени ” PopUp Заглавие “с твоя избор. Също така замени ” ТУК пишеш това което искаш да се покаже в изкачащия прозорец.” със HTML кода, който искаш.
Това е.!!
Note 1: Трябва и 3 кода (HTML, Java Script and CSS) да се пейстнат в кожата на блога ти.
Note 2: Можеш да намалиш или увеличиш секундите на появата на изкачащия прозорец като коригираш този низ
setTimeout(“loadPopup()”,5000);
също така можеш да промениш и размера на popup-а коригирайки този низ display:none;
position:fixed;
_position:absolute; /* hack for internet explorer 6*/
height:384px;
width:408px;
- SEO за хотели и къщи за гости - 24.09.2024
- Изкуственият интелект ще създаде ли търсачка конкурент на Google? - 21.08.2024
- Open AI анонсира собствена търсачка SearchGPT - 27.07.2024