Memperindah Tampilan Comment Box di Blogger

Tweet

D-Copy Blog's | Sekarang adalah mungkin dapat menyesuaikan kotak komentar blogger dengan cara sederhana dan tidak perlu mengedit HTML blogger Anda hanya melalui menambahkan beberapa css yang sederhana ini untuk blogger. Tampilan CSS Comment Box ini seperti comment box saya yang sudah saya terapkan ke akun blogger saya.

Langkah :

1. Buka akun Blogger Anda
2. Masuk  ke menu Layout > Add Gagdget
3. Tambahkan Widget HTML / Javascript baru di sidebar Anda.
4. Masukkan css berikut ke widget dan save Template Anda :

<style type="text/css">
 #comment-editor
{
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    -moz-font-feature-settings: normal;
    -moz-font-language-override: normal;
    -x-system-font: none;
    background-attachment: scroll;
    background-clip: border-box;
    background-color: #FFFFFF;
    background-origin: padding-box;
    background-position: 0 0;
    background-repeat: repeat-x;
    background-size: auto auto;
    border-bottom-color: #DDDDDD;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-left-color-ltr-source: physical;
    border-left-color-rtl-source: physical;
    border-left-color-value: #DDDDDD;
    border-left-style-ltr-source: physical;
    border-left-style-rtl-source: physical;
    border-left-style-value: solid;
    border-left-width-ltr-source: physical;
    border-left-width-rtl-source: physical;
    border-left-width-value: 1px;
    border-right-color-ltr-source: physical;
    border-right-color-rtl-source: physical;
    border-right-color-value: #DDDDDD;
    border-right-style-ltr-source: physical;
    border-right-style-rtl-source: physical;
    border-right-style-value: solid;
    border-right-width-ltr-source: physical;
    border-right-width-rtl-source: physical;
    border-right-width-value: 1px;
    border-top-color: #DDDDDD;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-top-style: solid;
    border-top-width: 1px;
    box-shadow: 5px 5px 5px #CCCCCC;
    color: #2F97FF;
    font-family: "ms sans serif",Arial;
    font-size: 12pt;
    font-size-adjust: none;
    font-stretch: normal;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    height: 213px !important;
    line-height: normal;
    padding-bottom: 5px;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 5px;
    width: 550px;
    height:215px;
}
 #comment-editor:hover {
    -moz-border-bottom-colors: none !important;
    -moz-border-image: none !important;
    -moz-border-left-colors: none !important;
    -moz-border-right-colors: none !important;
    -moz-border-top-colors: none !important;
    border-bottom-color: #C6C6C6 !important;
    border-bottom-style: solid !important;
    border-bottom-width: 1px !important;
    border-left-color-ltr-source: physical !important;
    border-left-color-rtl-source: physical !important;
    border-left-color-value: #C6C6C6 !important;
    border-left-style-ltr-source: physical !important;
    border-left-style-rtl-source: physical !important;
    border-left-style-value: solid !important;
    border-left-width-ltr-source: physical !important;
    border-left-width-rtl-source: physical !important;
    border-left-width-value: 1px !important;
    border-right-color-ltr-source: physical !important;
    border-right-color-rtl-source: physical !important;
    border-right-color-value: #C6C6C6 !important;
    border-right-style-ltr-source: physical !important;
    border-right-style-rtl-source: physical !important;
    border-right-style-value: solid !important;
    border-right-width-ltr-source: physical !important;
    border-right-width-rtl-source: physical !important;
    border-right-width-value: 1px !important;
    border-top-color: #C6C6C6 !important;
    border-top-style: solid !important;
    border-top-width: 1px !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
</style>