Viết Pr Thương hiệu, Quảng Cáo Sản Phẩm top 10 Google

logo
ván gỗ ghép
Review

Tạo mục lục giúp di chuyển nhanh đến nội dung trong bài viết blogspot

Park Hang Seo | tháng 2 21, 2019 | |

(Ivietpr) - Bước 1 : Chèn đoạn code CSS và đoạn Script bên dưới vào cuối  ]]></b:skin> : <style> /*===================================....

Bước 1 : Chèn đoạn code CSS và đoạn Script bên dưới vào cuối  ]]></b:skin> :

<style>
/*=====================================
= CSS TẠO MỤC LỤC
=====================================*/
#toc_container{background: #edf6ff;border: 1px solid #aaa;padding: 0 10px;margin-bottom: 1em;font-size:95%;}p.toc_title,ul.toc_list {margin: 5px;padding-left: 0;}.toc_list li {list-style: none;margin-top: 0px; margin: 0!important;}#toc_container a {text-decoration: none;text-shadow: none;color: #52b043;font-weight: 555;}#toc_container a:hover {color: #d7c20d;text-decoration: underline;}span.accordion{cursor: pointer;}div.panel {padding: 0 20px;max-height: 0;overflow: hidden;opacity: 0;}div.panel.show {opacity: 1;max-height:500px;}
</style>

<!-- #CODE ẨN/HIỆN MỤC LỤC -->
<script>
var acc = document.getElementsByClassName("accordion");
var i;
for (i = 0; i &lt; acc.length; i++) {
    acc[i].onclick = function(){
        this.classList.toggle("active");
        this.nextElementSibling.classList.toggle("show");
  }
}
</script>

Bước 2 : Kế đến chèn code sau vào vị trí cần hiển thị mục lục trong bài viết :

<div id="toc_container">
<b>MỤC LỤC: Nội dung bài viết</b>&nbsp; <span class="accordion active">[Ẩn/Hiện]</span>
<br />
<div class="panel show">
<ul class="toc_list">
<li><a href="#phan-1">Phần 1: abc</a></li>
<li><a href="#phan-2">Phần 2: abc</a></li>
<li><a href="#phan-3">Phần 3: abc</a></li>
<li><a href="#phan-4">Phần 4: abc</a></li>
<li><a href="#phan-5">Phần 5: abc</a></li>
</ul>
</div>
</div>

Bước 3 : Tạo ID vị trí di chuyển tương ứng :

<div id="phan-1"> 1. Tiêu đề 1</div>
       Nội dung bài viết của phần 1 ở đây
<div id="phan-2"> 2. Tiêu đề 2</div>
       Nội dung bài viết của phần 2 ở đây
<div id="phan-3"> 3. Tiêu đề 3</div>
       Nội dung bài viết của phần 3 ở đây
<div id="phan-4"> 4. Tiêu đề 4</div>
       Nội dung bài viết của phần 4 ở đây
<div id="phan-5"> 5. Tiêu đề 1</div>


Xem thêm : 

Tạo Floating Banner Quảng cáo ẩn hiện trượt dọc theo website
https://iris-tips.blogspot.com/2015/09/tao-floating-banner-quang-cao-an-hien.html

Chèn quảng cáo vào blogspot ở các vị trí
https://mocgin.com/blogspot/chen-quang-cao-vao-blogspot-o-cac-vi-tri.html

Tạo quảng cáo sticky ở chân trang website giống AdSense Page
https://iris-tips.blogspot.com/2017/08/tao-quang-cao-sticky-o-chan-trang-giong-AdSense-Page-Level-Ads.html

Làm widget trượt giống quảng cáo Admicro cho blog và web
http://blogmoicuahung.blogspot.com/2015/09/lam-widget-truot-giong-quang-cao.html

🎆🎆🎆💥💥💥📣📣📣 🏭 Bạn đang tìm đơn vị cung cấp gỗ Thông, gỗ Sồi ghép Solid, finger, ghép nguyên thanh bìa kích thước đặt ghép...

Người đăng: Nam Trung JSC vào Thứ Ba, 16 tháng 4, 2019

Xem thêm>>

Xem thêm>>