Mangastrap - Template Blogger Responsive

Update :



Format Tulisan template Mangastrap

Paragrap - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris venenatis, ante sit amet condimentum maximus, eros tortor scelerisque mauris, a commodo magna sem vel quam. Pellentesque sollicitudin posuere libero, eget venenatis mauris aliquet non. In tristique sapien id congue fringilla. Suspendisse lobortis blandit volutpat. Duis consequat libero id quam dignissim, eu molestie eros dictum. Sed sollicitudin semper elit ut consequat. In id sem lectus. Praesent vel vestibulum tortor, id sollicitudin tortor.


Tebal - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris venenatis, ante sit amet condimentum maximus, eros tortor scelerisque mauris, a commodo magna sem vel quam. Pellentesque sollicitudin posuere libero, eget venenatis mauris aliquet non. In tristique sapien id congue fringilla. Suspendisse lobortis blandit volutpat. Duis consequat libero id quam dignissim, eu molestie eros dictum. Sed sollicitudin semper elit ut consequat. In id sem lectus. Praesent vel vestibulum tortor, id sollicitudin tortor.


Miring - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris venenatis, ante sit amet condimentum maximus, eros tortor scelerisque mauris, a commodo magna sem vel quam. Pellentesque sollicitudin posuere libero, eget venenatis mauris aliquet non. In tristique sapien id congue fringilla. Suspendisse lobortis blandit volutpat. Duis consequat libero id quam dignissim, eu molestie eros dictum. Sed sollicitudin semper elit ut consequat. In id sem lectus. Praesent vel vestibulum tortor, id sollicitudin tortor.


Mangastrap - Template Blogger Responsive

Mangastrap - Template Blogger Responsive

Mangastrap - Template Blogger Responsive

Mangastrap - Template Blogger Responsive

Mangastrap - Template Blogger Responsive
Mangastrap - Template Blogger Responsive

Kotak Kutipan - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris venenatis, ante sit amet condimentum maximus, eros tortor scelerisque mauris, a commodo magna sem vel quam. Pellentesque sollicitudin posuere libero, eget venenatis mauris aliquet non. In tristique sapien id congue fringilla. Suspendisse lobortis blandit volutpat. Duis consequat libero id quam dignissim, eu molestie eros dictum. Sed sollicitudin semper elit ut consequat. In id sem lectus. Praesent vel vestibulum tortor, id sollicitudin tortor.

Cara Menggunakan Halaman Manga Info


<div class='manga-info'>
<div class="row no-gutters">
<!-- cover -->
<div class="col-12 col-sm-6 col-md-4 col-lg-3 col-xl-3 p-0"><div class="manga-cover">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgP5b6MBQ6mjY_N_1O1TngOrCL85Rpv-0KC8Ry_2ILj1WwtAvTo28KPH_gVx90a5X6whLyr1Yev7LCYbQtkcE_SEE_LW_8835hq4d7KLxsTpHBnmDav_3iklxDftDaSAzfYO5mD0eW4VpWe/s1600/mangastrap-codepelajar-tinggi.png" title='Nama Manga' alt='Nama Manga' />
</div></div>
<!-- tabel -->
<div class="col-12 col-sm-6 col-md-8 col-lg-9 col-xl-9 p-0"><div class="manga-table">
<table class="table table-hover table-sm">
<tr><th>Judul</th><td>[JUDUL_MANGA]</td></tr>
<tr><th>Status</th><td>[ONGOING/COMPLETE]</td></tr>
<tr><th>Rating</th><td>[RATE]</td></tr>
<tr><th>Author</th><td>[SAHA WEH]</td></tr>
<tr><th>Chapter</th><td>10 Chapter</td></tr>
<tr><th>Credit</th><td>Codepelajar.com</td></tr></table>
</div></div>

<div class="col-12"><div class="manga-sinopsis"><!-- sinopsis -->
<h3>Sinopsis</h3>
<div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse viverra diam eu blandit dictum. Duis vitae blandit metus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Quisque ut lacus sollicitudin, tristique diam quis, rhoncus ligula. Maecenas dapibus placerat nunc, nec faucibus augue sollicitudin at. Morbi lorem massa, consequat eu libero id, ullamcorper suscipit sem. Etiam varius lorem eget sem varius ultricies. Nulla bibendum felis in dolor dapibus, eget molestie mauris lacinia. Donec commodo vestibulum urna, id cursus libero cursus et. Nulla lobortis eget mauris non laoreet. Sed tempus lacus sit amet odio euismod bibendum. Fusce rhoncus, arcu sagittis lobortis convallis, nisl odio imperdiet enim, ac fringilla nunc lorem a sapien.
</div></div></div>

<div class="col-12"><div class="manga-chapter-list">
<script type='text/javascript'>//<![CDATA[//
function mangaSeries(json) {var manga_series = 'Orange';
document.write('<br/><h4>Daftar Isi Manga: '+manga_series+'</h4>');document.write('<table class="table table-hover"><thead class="thead-dark"><tr><th>Chapter</th><th>Link</th></tr>');for (var i = 0; i < json.feed.entry.length; i++) {for (var j = 0; j < json.feed.entry[i].link.length; j++) {if (json.feed.entry[i].link[j].rel == 'alternate') {var url_manga = json.feed.entry[i].link[j].href;break;}}var judul_manga = json.feed.entry[i].title.$t;var item = '<tr><td><a href="'+url_manga+'" title="'+judul_manga+'" target="_blank"><b>'+judul_manga+'</b></a></td><td class="text-right"><a class="btn btn-primary btn-sm" href="'+url_manga+'" title="'+judul_manga+'" target="_blank"><i class="fa fa-book mr-2"></i>Read Now!</a></td></tr>';document.write(item);}document.write('</table>')} //]]>//
</script>
<script src="/feeds/posts/default/-/Orange?alt=json-in-script&callback=mangaSeries" type='text/javascript'></script>
</div>
</div>
</div>
</div>

Cara Posting Mode Manga


<div class='manga-reader'>
<!-- masukan gambar disini -->
</div>

Kelas .manga-reader perlu dimasukan untuk memunculkan pilih chapter.

3 Comments