Kodlanmasında herhangi bir şekilde Javascript ve flash kullanılmayan bu mükemmel duyuru eklentisi, sadece HTML ve CSS3 kullanılarak yapılmıştır. Sitenizde herhangi bir kasmaya sebep olmaz.
Blogger Yönetici Paneline giriş yapıyoruz.
Şablon > HTML'yi Düzenle'ye giriyoruz.
Açılan kod sayfasında Ctrl+F yaparak </body> 'i aratıyoruz ve hemen üstüne aşağıda ki kodu yapıştırıyoruz.
Diğer bir ekleme yolu ise;
Yerleşim > Gadget Ekle > HTML/JavaScript'i açıp, aşağıda ki kodu açılan sayfaya yapıştırarak eklentiyi kullanabilirler.
<!--Blogkaynagi Blogger Duyuru Eklentisi Kod Başlangıç-->
<div id="menucon">
<div id="allcoder-tex">
<br/><b>Duyuru</b><br/><br/>
Merhaba!
<br/><br/>
BLOGUMUZA HOSGELDİNİZ UMARIM İYİ VAKİT GEÇİRİRSİNİZ
</div>
</div>
<allcoder><style> #menucon{ position:fixed; bottom:10px; left:10px; width:130px;height:130px; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYFuUGgqdhO0bexyHn4dgfvFYrGPzGr-2MD5mjehrxhODq7rIbhxyBYHfWk4oyi3udZR5FW5TDTS1-z12GTIABtJWN7vxbJeuPHxRlXFyyNuUFgV6x3kLEXAbABRqayc8ooxhg7a5uscA3/s1600/see.png) no-repeat center center; transition: all 0.8s ease-in-out; background-size:cover; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; -webkit-transition-timing-function:ease-in-out; } #menucon:hover{ bottom:35px;left:35px; width:80px;height:80px; transform: rotate(720deg); -ms-transform: rotate(720deg); -webkit-transform: rotate(720deg); }#allcoder-tex{position:absolute;bottom:37px;left:38px; box-shadow: -1px 1px 5px 0px #888888; transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; line-height:22px; -webkit-transition-timing-function:ease-in-out; opacity:0; width:0px;height:0px; padding:6px;color:#fff; font-family:Helvetica, Arial, sans-serif; font-weight:normal; text-decoration:none; font-size:14px; text-align:center; -webkit-border-radius: 8px; -webkit-border-bottom-left-radius: 0; border-radius: 8px; border-bottom-left-radius: 0; }</style><style> #menucon:hover #allcoder-tex{ width:200px;height:250px; background:#444; opacity:0.6;} </style></allcoder>
<!Blogger Duyuru Eklentisi Kod Bitiş-->
Hiç yorum yok:
Yorum Gönder