Đăng kýĐăng nhập

Share
|

Code Table of Content blogspot Tự động auto


[Blogger] Code mục lục bài viết (Table of Content) Tự động auto v1 HycvACx

Demo online: https://blog.danganhviet.com/2018/08/binh-phong-la-gi.html

Sử dụng mỏ neo đã phát triển khá lâu và nhiều mã nguồn đã áp dụng rất tốt, Ngoài ra mỏ neo cũng khá tốt với ae làm S.E.O. Thường thì ae làm WP thì có nhiều plugin hỗ trợ, còn với ae Blogger thì toàn làm bằng tay, Trước đây có hứa làm cho ae trong nhóm nhưng giờ mới có thời gian làm. ( Thật ra chưa đầu tư cho nó lắm nên hơi xấu, ae nào copy về làm đẹp có thể sửa lại css giúp mình cho thành ver 2 .

Cảm ơn ae.

Hướng dẫn thêm  Code mục lục bài viết (Table of Content) Tự động


Để giảm tải thời gian cho ae mình gộp hết js vào luôn. ae cho thằng vào cuối code là được nhé.

Code:


  
<b:if cond='data:blog.pageType == "item"'>
<script src='https://dl.dropboxusercontent.com/s/p9iu8se1qpwo0j0/jquery.toc5.js'/>

<div class='show' id='slidebox'><div class='slidebox-title slidebox-www'><span style='float:left;margin:0 15px;'></span><span><a href='javascript:void(0);' id='slidebox-close' title='close'>×</a></span><span><a href='javascript:void(0);' id='slidebox-minimize' title='minimize'>−</a></span><span><a href='javascript:void(0);' id='slidebox-maximize' title='maximize'>+</a></span></div>
<div class='article1'/>
</div>

 <style>
/* Widget table Content */
#slidebox{background-color:#f9f9f9;border:1px solid #CCC;background:#fff;width:100%;max-width:355px;height:255px;position:fixed;overflow:hidden;right:-360px;z-index:99;text-align:left;box-shadow:0 1px 0 0 rgba(0,0,0,0.03);transition:all .4s ease-out}
.slidebox-title{background:#3a5795;color:#fff;display:block;height:45px;line-height:45px;width:100%;font-size:14px;text-transform:capitalize;font-weight:700;letter-spacing:.5px}
.slidebox-title span a{font-family:initial;float:right;height:40px;margin:0 0 0 15px;text-align:center;color:#fff;font-size:20px}
a#slidebox-close,a#slidebox-close{margin-right:15px}
.slidebox-title >span >h2{font-size:20px!important;font-weight:normal!important}
.slidebox-container{border:none;float:left;width:100%;height:auto;margin:3px}
.slidebox-container >div{border:none;margin:3px 0;padding:10px 0}
.slidebox-container >div >span{font-size:14px}
.show{bottom:84px}
.hide{bottom:-205px}
#closetoc,#toc{background-color:#eeeeee;border:1px solid #cccccc;color:#454545;cursor:pointer;float:right;font-size:15px;height:25px;margin:9px -3px 0 10px;padding:2px;width:25px}
#closetoc:hover,#toc:hover{background-color:#F9F9F9;border:1px solid #000000;color:#000000}
#toc{box-shadow:0 1px 2px rgba(30,25,25,0.2);-webkit-transition:all 500ms ease;-moz-transition:all 500ms ease;-ms-transition:all 500ms ease;-o-transition:all 500ms ease;transition:all 500ms ease;float:right;right:15px;top:5px;color:#454545}
#toc:active{outline:none}
#tocid{border-bottom:1px solid #454545;list-style-type:none;text-align:center;margin:0 0 0 -26px;padding:0}
#IndexJS{font-size:15px;right:15px;text-align:left;text-decoration:none;color:#454545;margin:10px 0 10px 10px;padding:15px 15px 15px 25px;-webkit-transition:all 500ms ease;-moz-transition:all 500ms ease;-ms-transition:all 500ms ease;-o-transition:all 500ms ease;transition:all 500ms ease;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
#IndexJS li{white-space:normal;word-wrap:break-word}
#IndexJS li a{color:#454545;text-decoration:none}
#IndexJS li a:hover{text-decoration:underline}
#closetoc,#toc{background-color:#EEE;border:1px solid #CCC;color:#454545;cursor:pointer;float:right;font-size:15px;height:25px;width:55px;margin:9px -3px 0 10px;padding:2px}
#closetoc:hover,#toc:hover{background-color:#F9F9F9;border:1px solid #000;color:#000}
#toc{box-shadow:0 1px 2px rgba(30,25,25,0.2);float:right;right:15px;top:5px;color:#454545;-webkit-transition:all 500s ease;-moz-transition:all 500s ease;-ms-transition:all 500s ease;-o-transition:all 500s ease;transition:all 500s ease}
#toc:active{outline:none}
h1:target,h2:target,h3:target,h4:target,h5:target,h6:target{-webkit-animation:2s  ease 0s normal none 1 trgt;-moz-animation:2s  ease 0s normal none 1 trgt;-ms-animation:2s  ease 0s normal none 1 trgt;-o-animation:2s  ease 0s normal none 1 trgt;animation:2s  ease 0s normal none 1 trgt;-webkit-transition:color 500ms ease 0s;-moz-transition:color 500ms ease 0s;-ms-transition:color 500ms ease 0s;-o-transition:color 500ms ease 0s;transition:color 500ms ease 0s}

  </style>

    </b:if>

--Chữ ký--
www.danganhviet.com


  • - Tránh đặt tiêu đề các dạng như: Giúp em với, Code này hay nè, Vào xem nè anh em,...
    - Đăng bài phải có ảnh demo hoặc viết mô tả rõ ràng, code phải bỏ vào khung code
    - Không comment vô nghĩa, không spam, không chữi tục, không post link độc hại, không hide bài viết
    - Hạn chế viết tắt, viết chữ màu, chữ to, chữ in đậm
|
Đặt code này ở đâu vậy bạn
|
@longanit đã viết:
Đặt code này ở đâu vậy bạn


CÓ thể để ở footer nhé bạn

--Chữ ký--
www.danganhviet.com


  • - Tránh đặt tiêu đề các dạng như: Giúp em với, Code này hay nè, Vào xem nè anh em,...
    - Đăng bài phải có ảnh demo hoặc viết mô tả rõ ràng, code phải bỏ vào khung code
    - Không comment vô nghĩa, không spam, không chữi tục, không post link độc hại, không hide bài viết
    - Hạn chế viết tắt, viết chữ màu, chữ to, chữ in đậm
|
Có mấy bài viết mình không để thẻ h nhưng nó vẫn hiện ra mặc dù bài đó không cần mục lục
có các nào khắc phục không bạn ?
|
@Hưng đã viết:
Có mấy bài viết mình không để thẻ h nhưng nó vẫn hiện ra mặc dù bài đó không cần mục lục
có các nào khắc phục không bạn ?


Bài viết tốt thì vẫn nên có các thẻ H. muốn ẩn nó đi thì trong bài viết dùng css vào bài viết cho nó ẩn đi thôi

--Chữ ký--
www.danganhviet.com


  • - Tránh đặt tiêu đề các dạng như: Giúp em với, Code này hay nè, Vào xem nè anh em,...
    - Đăng bài phải có ảnh demo hoặc viết mô tả rõ ràng, code phải bỏ vào khung code
    - Không comment vô nghĩa, không spam, không chữi tục, không post link độc hại, không hide bài viết
    - Hạn chế viết tắt, viết chữ màu, chữ to, chữ in đậm
|
Permissions in this forum:
Bạn không có quyền trả lời bài viết
    • Bài viết

      Tổng số bài viết đã gửi vào diễn đàn là 3793

    • Thành Viên

      Diễn Đàn hiện có 634 thành viên

  • emoji_peopleTop posters
  • group_addTình hình diễn đàn
    Hiện có 2 người đang truy cập Diễn Đàn, gồm: 0 Thành viên, 0 Thành viên ẩn danh và 2 Khách viếng thăm :: 2 Bots
    Không