TUTORIAL
Vá para Painel do Blogger> Layout> Adicionar um Gadget Adicionar HTML/JavaScrip
Copie o código abaixo e cole nele. Depois salvá-lo. E pronto!.
procure um ponto melhor para seu blogger , Slideshow editável pode ajustar de acordo com seu template!
Veja Aqui o Resultado
<style type="text/css">
.slider-box {
background: none repeat scroll 0 0 #FAFAFA;
border-radius: 5px 5px 5px 5px;
box-shadow: 0 0 3px #333333;
margin: 0 auto;
width: 675px;
overflow: hidden;
}
#slider-wrapper {
margin: 0 auto;
padding: 10px;
}
#jslider-container {
border: 2px solid #FFFFFF;
max-width: 550px;
position: relative;
text-align: left;
z-index: 90;
}
</style>
<link href="http://project.dimpost.com/image-slider/wowslider/css/wow-slider.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="https://code.jquery.com/jquery-1.12.0.min.js"></script>
<div class="slider-box">
<div id="slider-wrapper">
<div id="jslider-container">
<div class="jslider_images">
<ul>
<li>
<a href="http://dimpost.com">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhC219ajkLBtlud-MZMdYEcGpZrlzGar5k5X2P09yv2GmR2YdXSABfTJIoHluNqWykTEhrLWZU2w1AHoH4NCGN10azLDboupNh1wFebU7EJo1L8FLZJkIDrjtAsKRpDtHpoguslpmWlQ2ch/s550/sample1.jpg" title="Sunset" />
</a>A boat with beautiful sunset.</li>
<li>
<a href="#">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnFDj8fAakj_kbjsdIJ9HtSwG8zN81L4A59Znco56vNw2uNKdb3NK3KrUhy6wenUeoUM9fUXnUuox8xS-HSAMFqeLXvIEL2WdzxyyHWNNh7jf0Mmiho8YCXpvw33D90ET-m6UjrQChDpuN/s550/sample2.jpg" title="Rainbow" />
</a>
</li>
<li>
<a href="#">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0djv-GXeAyynXP6b8K0DOpxGfT2j5MOliSWSIGIchybCvcMZeAfMz0hMz4z7fA4lWQFw-JGFDBtNpWDYuqBqS4TXCmvme3CcUI4hT7tFlUx0dIoxGzvD_skhwfM7JbMn84VNUZnvFxGdq/s550/sample3.jpg" title="True Nature" />
</a>Tree in field with blue sky.</li>
<li>
<a href="#">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbfv7Xddz34fAK-9AzO55vtytGRFBWwhPvk9S6V-ezXbYZ83SiRzpXu4yLFHjbFMfHme-iJJzAJoqDfYho97Qiq_iFuTNJfj94W-7W9nVns_3ejoi2CC3kJgU_eifr0pfbEs-MkavpY86M/s550/sample4.jpg" title="Sunrise" />
</a>Amaizing sunrise moment</li>
<li>
<a href="#">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQeQeLxnc3sum3Rt_XP5P9wVwJkFCNwu8lmPi3t9bRIegHr8RZ32elHgjBKTQoJ2DWBzR8DBa6mL0B782wnmEw02CZ6JWIrr6eANoTJR-FCqTKOpjvFZ5ZnNPTSFRT8m0zg66K4n13jm-t/s550/sample5.jpg" title="CAR in HDR Nature" />
</a>
</li>
<li>
<a href="#">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdq9on6_-IdpOO2SxKi1_XKEv3j73laeEr_p-nWVsp2GMGhnP5zHdWcPFR1qAvZbswtqirsbZ_WUQwOhkfetnye5jap6392XHSeXzBZDoj24Ej3gxOyVVvzHLa3luOc7dHx9oA3TwwyWLp/s550/sample6.jpg" title="Sunshine" />
</a>
</li>
</ul>
</div>
<div class="jslider_thumbs">
<div>
<a href="#" title="Sunset"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7COj465JbNQVp8nBe3bqF6w9eGGMbh5cSsV_lAe2NWRFswBZ7IuIDQw5xBEZPXRG3bSq07WW9aZItJNxFu9_ANpzWDodH7aPF0EQAs3QyiwVGsKyX840ivvpuC1fIaYlyBXh_3-v1MJC6/s85/sample1.jpg" /></a>
<a href="#" title="Rainbow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiMkDjN5shpjv8Jz8mw8JAygd1ufXxbu7Q95muOeYHddeUqHOV-uNbK4jDI8fiZyueT2CeCTZ97HpDpKkI8feo0F4DlBhyphenhyphenusuX71K7KHNP93t2a7VnQjJzrxCgj7UUeUu5XCgMztwww6Ib/s85/sample2.jpg" /></a>
<a href="#" title="True Nature"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyDGLh5vHVpXiJZwttde13X0mQTVBmsc8LyA-OmeSTUdwfRqEHBxWlc0Ni5I0vLSQjfbMGxsp07cO7LttXobsa43-eTAEBjiv_mlt5cKjhMhUNR0ZhMdY4AgzOjQpfOWxRa_grrA4Yz5c1/s85/sample3.jpg" /></a>
<a href="#" title="Sunrise"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmZKI9tenYCbh8zv_4ywZK4VVDukPdV5RnQ5OSqdAMTvsLwT5mE-4SW4nUtOWMCmtbDP6r3Gq8h-Y-eXI-lIIcRdnnCQyk2rVoPBIaAf_yE56uvTRHZDHJDvUbqkxjEQQR_eoCnXvxA9Ty/s85/sample4.jpg" /></a>
<a href="#" title="CAR in HDR Nature"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_MByRgczxdfQkm1xY0fwiYsEtfunEm9ZnN2xKwlsvLcc9p0or_vD3gn7ifRGe9MG54SoiY5pkbB3UFLYkcvBMxMnfddKTcAy5p71sL6WaEKS61W_Y0L77JIlSb_rL3yAsdLFwredtU6-o/s85/sample5.jpg" /></a>
<a href="#" title="Sunshine"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0cZxJlpWLcaWD42kAt9HD-lOV2JGPmI_AaQ-i8slFxqeU1l3aEH3IVjIJl9VVxVIXYHnMDXzsyCYpWQ0TgUWFtF1Jqr8llT7AUlUFATdSpjZjQwJjAVuJ_bObR7qaV0xVO_n_wpirPp70/s85/sample6.jpg" /></a>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="http://dimpost.googlecode.com/files/wow-slider.js"></script>
( Faça isso caso Slideshow pare de funcionar)Baixe Aqui um backup do motor jquery., basta subir este recomendo subir no site https://www.dropbox.com/ subir em public Depois é só substituir.


Nenhum comentário:
Postar um comentário