Thêm code ẩn hiện trong bài viết (Spoiler)

Cài đặt ẩn hiện trong bài viết - Thời gian này tôi sẽ chia sẻ thủ thuật đơn giản như thế nào để làm cho một spoiler với một hiệu ứng trình chiếu trong các bài đăng blog.



Đây là cách các ứng dụng:

Trước tiên, hãy để các blogger> Template> Edit HTML> Áp dụng mã CSS bên dưới trước khi </style> hay ]]></b: skin> và áp dụng mã jQuery trước thẻ </body>

#flippy {
    text-align: center;
}

#flippy button {
    background: #aa65c7;
    color: #fff;
    text-align: center;
    margin: 0 auto;
    border: none;
    border-radius: 3px;
    padding: 8px 16px;
    margin: 10px auto;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0px 3px 0px 0px #883da7;
    vertical-align: middle;
    cursor: pointer;
    text-shadow: 0 1px rgba(0, 0, 0, 0.3);
    transition: background 0.1s ease-in-out;
}

#flippy button:hover, #flippy button:focus {
    background: #9e4fbf;
    outline: none;
}

#flippanel {
    padding: 1px;
    text-align: left;
    background: #f5f5f5;
    border: 0px;
}

#flippanel {
    padding: 24px;
    display: none;
}

<script>
$(document).ready(function() {
 $("#flippy").click(function() {
 $("#flippanel").slideToggle("normal");
 });
});
</script>

Sau đó áp dụng các mã sau đây trong bài viết ở tab HTML

<div id="flippy"><button>Cekidot</button></div>
<div id="flippanel">
Nội dung
</div>

Demo