Author: Abdul Hamid

  • Cara dan Fungsi Penggunaan Tag Textarea Form HTML

    www.laborblog.my.id - Objek form textarea digunakan untuk membuat teks input yang dapat berisi lebih dari satu baris input. Tag textarea mirip dengan tag teks jenis input, tetapi memiliki keuntungan berisi banyak baris. Biasanya, tag textarea digunakan untuk entri yang panjang, seperti komentar, deskripsi, atau catatan.

    Ilustrasi
    Objek form textarea digunakan untuk membuat teks input yang dapat berisi lebih dari satu baris input. Tag textarea mirip dengan tag teks jenis input, tetapi memiliki keuntungan berisi banyak baris. Biasanya, tag textarea digunakan untuk entri yang panjang, seperti komentar, deskripsi, atau catatan.
    Untuk menggunakan Textarea, kita hanya mengambil label Textarea sebagai berikut:
    <textarea></textarea>

    Hasil

    Teks dapat disisipkan di antara tag pembuka dan penutup yang akan ditampilkan sebagai bidang awal text area sebagai berikut:
    <textarea>Contoh</textarea>

    Hasil

    Meskipun tidak diperlukan, tetapi jika text area digunakan dalam formulir, atribut name bertindak sebagai identitas tag textarea. Identitas ini diperlukan selama pemrosesan sisi server (misalnya menggunakan PHP). Atribut name ini akan menjadi variabel untuk menyimpan nilai yang dipilih oleh pengguna. Atribut name ditempatkan di dalam tag textarea:
    <textarea name=”contoh”>contoh</textarea>

    Hasil

    Untuk membatasi tampilan lebar kolom (cols) dan tinggi baris (rows) dari zona teks. Nilai yang dimasukkan adalah jumlah karakter yang menjadi lebar kotak teks. Misalkan kita mengatur atribut cols = “40”, maka kotak teks akan memiliki lebar karakter 40. Namun, lebar ini tidak akan tepat 40 karakter, karena akan tergantung pada font serta jenis karakter yang diinput.
    Contoh penggunaan atribut cols dan rows:
    <textarea cols=”40″>Contoh</textarea>
    <textarea cols=”40″ rows=”10″>Contoh</textarea>

    Hasil

    Atribut disabled dan readonly digunakan untuk membuat kotak teks tidak dapat digunakan. Penggunaan atribut ini biasanya dipadukan dengan javascript agar bekerja secara maksimal. Misalnya, kotak teks hanya dapat diisi jika pengguna telah mengisi bidang lain. Kedua atribut ini hanya memiliki 1 nilai yaitu dirinya sendiri yang ditulis dengan disabled = “disabled” dan readonly = “readonly”. Berikut adalah contoh penulisannya:
    <textarea readonly=”readonly”>Contoh</textarea>
    <textarea disabled=”disabled”>Contoh</textarea>

    Hasil

    Meskipun dua kotak teks yang memiliki atribut ini tidak dapat digunakan, keduanya akan terlihat berbeda. Atribut yang dinonaktifkan akan membuat kotak teks menjadi abu-abu, sedangkan atribut read-only akan terlihat seperti kotak teks biasa. Oleh karena itu, atribut nonaktif biasanya sering digunakan karena akan memberikan kesan kepada pengguna bahwa kotak teks tidak dapat digunakan.


    Selain atribut name, value, column, rows, disabled dan read-only, kita juga dapat menggunakan atribut umum seperti id dan class dalam tag textarea. Id dan tag class akan diperlukan untuk pemrograman HTML menggunakan JavaScript dan CSS. Terkadang kotak teks diperlukan untuk memasukkan formulir yang membutuhkan kalimat panjang seperti komentar.

  • CSS Button HTML

    www.laborblog.my.id - Button is one of the HTML elements that are often found on a website, this element is usually used to submit forms or it could be for other things.

    CSS Button HTML
    Button is one of the html elements that are often found on a website, this element is usually used to submit forms or it could be for other things. Here are some interesting button options:



    <!– HTML !–>
    <button class=”button-1″ role=”button”>Button 1</button>
    <!– CSS !–>
    <style>
    .button-1 {
    background-color: #EA4C89;
    border-radius: 8px;
    border-style: none;
    box-sizing: border-box;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-family: “Haas Grot Text R Web”, “Helvetica Neue”, Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 500;
    height: 40px;
    line-height: 20px;
    list-style: none;
    margin: 0;
    outline: none;
    padding: 10px 16px;
    position: relative;
    text-align: center;
    text-decoration: none;
    transition: color 100ms;
    vertical-align: baseline;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    }

    .button-1:hover,
    .button-1:focus {
    background-color: #F082AC;
    }
    </style>

    <!– HTML !–>
    <button class=”button-2″ role=”button”>Button 2</button>
    <!– CSS !–>
    <style>
    .button-2 {
    background-color: rgba(51, 51, 51, 0.05);
    border-radius: 8px;
    border-width: 0;
    color: #333333;
    cursor: pointer;
    display: inline-block;
    font-family: “Haas Grot Text R Web”, “Helvetica Neue”, Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    list-style: none;
    margin: 0;
    padding: 10px 12px;
    text-align: center;
    transition: all 200ms;
    vertical-align: baseline;
    white-space: nowrap;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    }
    </style>

    <!– HTML !–>
    <button class=”button-3″ role=”button”>Button 3</button>
    <!– CSS !–>
    <style>
    .button-3 {
    appearance: none;
    background-color: #2ea44f;
    border: 1px solid rgba(27, 31, 35, .15);
    border-radius: 6px;
    box-shadow: rgba(27, 31, 35, .1) 0 1px 0;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-family: -apple-system,system-ui,”Segoe UI”,Helvetica,Arial,sans-serif,”Apple Color Emoji”,”Segoe UI Emoji”;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    padding: 6px 16px;
    position: relative;
    text-align: center;
    text-decoration: none;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    vertical-align: middle;
    white-space: nowrap;
    }

    .button-3:focus:not(:focus-visible):not(.focus-visible) {
    box-shadow: none;
    outline: none;
    }

    .button-3:hover {
    background-color: #2c974b;
    }

    .button-3:focus {
    box-shadow: rgba(46, 164, 79, .4) 0 0 0 3px;
    outline: none;
    }

    .button-3:disabled {
    background-color: #94d3a2;
    border-color: rgba(27, 31, 35, .1);
    color: rgba(255, 255, 255, .8);
    cursor: default;
    }

    .button-3:active {
    background-color: #298e46;
    box-shadow: rgba(20, 70, 32, .2) 0 1px 0 inset;
    }
    </style>

    <!– HTML !–>
    <button class=”button-4″ role=”button”>Button 4</button>
    <!– CSS !–>
    <style>
    .button-4 {
    appearance: none;
    background-color: #FAFBFC;
    border: 1px solid rgba(27, 31, 35, 0.15);
    border-radius: 6px;
    box-shadow: rgba(27, 31, 35, 0.04) 0 1px 0, rgba(255, 255, 255, 0.25) 0 1px 0 inset;
    box-sizing: border-box;
    color: #24292E;
    cursor: pointer;
    display: inline-block;
    font-family: -apple-system, system-ui, “Segoe UI”, Helvetica, Arial, sans-serif, “Apple Color Emoji”, “Segoe UI Emoji”;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    list-style: none;
    padding: 6px 16px;
    position: relative;
    transition: background-color 0.2s cubic-bezier(0.3, 0, 0.5, 1);
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    vertical-align: middle;
    white-space: nowrap;
    word-wrap: break-word;
    }

    .button-4:hover {
    background-color: #F3F4F6;
    text-decoration: none;
    transition-duration: 0.1s;
    }

    .button-4:disabled {
    background-color: #FAFBFC;
    border-color: rgba(27, 31, 35, 0.15);
    color: #959DA5;
    cursor: default;
    }

    .button-4:active {
    background-color: #EDEFF2;
    box-shadow: rgba(225, 228, 232, 0.2) 0 1px 0 inset;
    transition: none 0s;
    }

    .button-4:focus {
    outline: 1px transparent;
    }

    .button-4:before {
    display: none;
    }

    .button-4:-webkit-details-marker {
    display: none;
    }
    </style>

    <!– HTML !–>
    <button class=”button-5″ role=”button”>Button 5</button>
    <style>
    /* CSS */
    .button-5 {
    align-items: center;
    background-clip: padding-box;
    background-color: #fa6400;
    border: 1px solid transparent;
    border-radius: .25rem;
    box-shadow: rgba(0, 0, 0, 0.02) 0 1px 3px 0;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-family: system-ui,-apple-system,system-ui,”Helvetica Neue”,Helvetica,Arial,sans-serif;
    font-size: 16px;
    font-weight: 600;
    justify-content: center;
    line-height: 1.25;
    margin: 0;
    min-height: 3rem;
    padding: calc(.875rem – 1px) calc(1.5rem – 1px);
    position: relative;
    text-decoration: none;
    transition: all 250ms;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    vertical-align: baseline;
    width: auto;
    }

    .button-5:hover,
    .button-5:focus {
    background-color: #fb8332;
    box-shadow: rgba(0, 0, 0, 0.1) 0 4px 12px;
    }

    .button-5:hover {
    transform: translateY(-1px);
    }

    .button-5:active {
    background-color: #c85000;
    box-shadow: rgba(0, 0, 0, .06) 0 2px 4px;
    transform: translateY(0);
    }
    </style>

    <!– HTML !–>
    <button class=”button-6″ role=”button”>Button 6</button>
    <style>
    .button-6 {
    align-items: center;
    background-color: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: .25rem;
    box-shadow: rgba(0, 0, 0, 0.02) 0 1px 3px 0;
    box-sizing: border-box;
    color: rgba(0, 0, 0, 0.85);
    cursor: pointer;
    display: inline-flex;
    font-family: system-ui,-apple-system,system-ui,”Helvetica Neue”,Helvetica,Arial,sans-serif;
    font-size: 16px;
    font-weight: 600;
    justify-content: center;
    line-height: 1.25;
    margin: 0;
    min-height: 3rem;
    padding: calc(.875rem – 1px) calc(1.5rem – 1px);
    position: relative;
    text-decoration: none;
    transition: all 250ms;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    vertical-align: baseline;
    width: auto;
    }

    .button-6:hover,
    .button-6:focus {
    border-color: rgba(0, 0, 0, 0.15);
    box-shadow: rgba(0, 0, 0, 0.1) 0 4px 12px;
    color: rgba(0, 0, 0, 0.65);
    }

    .button-6:hover {
    transform: translateY(-1px);
    }

    .button-6:active {
    background-color: #F0F0F1;
    border-color: rgba(0, 0, 0, 0.15);
    box-shadow: rgba(0, 0, 0, 0.06) 0 2px 4px;
    color: rgba(0, 0, 0, 0.65);
    transform: translateY(0);
    }
    </style>

    <!– HTML !–>
    <button class=”button-7″ role=”button”>Button 7</button>
    <style>
    .button-7 {
    background-color: #0095ff;
    border: 1px solid transparent;
    border-radius: 3px;
    box-shadow: rgba(255, 255, 255, .4) 0 1px 0 0 inset;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-family: -apple-system,system-ui,”Segoe UI”,”Liberation Sans”,sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.15385;
    margin: 0;
    outline: none;
    padding: 8px .8em;
    position: relative;
    text-align: center;
    text-decoration: none;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    vertical-align: baseline;
    white-space: nowrap;
    }

    .button-7:hover,
    .button-7:focus {
    background-color: #07c;
    }

    .button-7:focus {
    box-shadow: 0 0 0 4px rgba(0, 149, 255, .15);
    }

    .button-7:active {
    background-color: #0064bd;
    box-shadow: none;
    }
    </style>

    <!– HTML !–>
    <button class=”button-8″ role=”button”>Button 8</button>
    <!– CSS!–>
    <style>
    .button-8 {
    background-color: #e1ecf4;
    border-radius: 3px;
    border: 1px solid #7aa7c7;
    box-shadow: rgba(255, 255, 255, .7) 0 1px 0 0 inset;
    box-sizing: border-box;
    color: #39739d;
    cursor: pointer;
    display: inline-block;
    font-family: -apple-system,system-ui,”Segoe UI”,”Liberation Sans”,sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.15385;
    margin: 0;
    outline: none;
    padding: 8px .8em;
    position: relative;
    text-align: center;
    text-decoration: none;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    vertical-align: baseline;
    white-space: nowrap;
    }

    .button-8:hover,
    .button-8:focus {
    background-color: #b3d3ea;
    color: #2c5777;
    }

    .button-8:focus {
    box-shadow: 0 0 0 4px rgba(0, 149, 255, .15);
    }

    .button-8:active {
    background-color: #a0c7e4;
    box-shadow: none;
    color: #2c5777;
    }
    </style>

    <!– HTML !–>
    <button class=”button-9″ role=”button”>Button 9</button>
    <!– CSS!–>
    <style>
    .button-9 {
    align-items: center;
    appearance: none;
    background-color: #fff;
    border-radius: 24px;
    border-style: none;
    box-shadow: rgba(0, 0, 0, .2) 0 3px 5px -1px,rgba(0, 0, 0, .14) 0 6px 10px 0,rgba(0, 0, 0, .12) 0 1px 18px 0;
    box-sizing: border-box;
    color: #3c4043;
    cursor: pointer;
    display: inline-flex;
    fill: currentcolor;
    font-family: “Google Sans”,Roboto,Arial,sans-serif;
    font-size: 14px;
    font-weight: 500;
    height: 48px;
    justify-content: center;
    letter-spacing: .25px;
    line-height: normal;
    max-width: 100%;
    overflow: visible;
    padding: 2px 24px;
    position: relative;
    text-align: center;
    text-transform: none;
    transition: box-shadow 280ms cubic-bezier(.4, 0, .2, 1),opacity 15ms linear 30ms,transform 270ms cubic-bezier(0, 0, .2, 1) 0ms;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    width: auto;
    will-change: transform,opacity;
    z-index: 0;
    }

    .button-9:hover {
    background: #F6F9FE;
    color: #174ea6;
    }

    .button-9:active {
    box-shadow: 0 4px 4px 0 rgb(60 64 67 / 30%), 0 8px 12px 6px rgb(60 64 67 / 15%);
    outline: none;
    }

    .button-9:focus {
    outline: none;
    border: 2px solid #4285f4;
    }

    .button-9:not(:disabled) {
    box-shadow: rgba(60, 64, 67, .3) 0 1px 3px 0, rgba(60, 64, 67, .15) 0 4px 8px 3px;
    }

    .button-9:not(:disabled):hover {
    box-shadow: rgba(60, 64, 67, .3) 0 2px 3px 0, rgba(60, 64, 67, .15) 0 6px 10px 4px;
    }

    .button-9:not(:disabled):focus {
    box-shadow: rgba(60, 64, 67, .3) 0 1px 3px 0, rgba(60, 64, 67, .15) 0 4px 8px 3px;
    }

    .button-9:not(:disabled):active {
    box-shadow: rgba(60, 64, 67, .3) 0 4px 4px 0, rgba(60, 64, 67, .15) 0 8px 12px 6px;
    }

    .button-9:disabled {
    box-shadow: rgba(60, 64, 67, .3) 0 1px 3px 0, rgba(60, 64, 67, .15) 0 4px 8px 3px;
    }
    </style>

    <!– HTML !–>
    <button class=”button-10″ role=”button”>Button 10</button>
    <!– CSS!–>
    <style>
    .button-10 {
    appearance: button;
    background-color: #1899D6;
    border: solid transparent;
    border-radius: 16px;
    border-width: 0 0 4px;
    box-sizing: border-box;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-family: din-round,sans-serif;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .8px;
    line-height: 20px;
    margin: 0;
    outline: none;
    overflow: visible;
    padding: 13px 16px;
    text-align: center;
    text-transform: uppercase;
    touch-action: manipulation;
    transform: translateZ(0);
    transition: filter .2s;
    user-select: none;
    -webkit-user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    width: 18%;
    }

    .button-10:after {
    background-clip: padding-box;
    background-color: #1CB0F6;
    border: solid transparent;
    border-radius: 16px;
    border-width: 0 0 4px;
    bottom: -4px;
    content: “”;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
    }

    .button-10:main,
    .button-10:focus {
    user-select: auto;
    }

    .button-10:hover:not(:disabled) {
    filter: brightness(1.1);
    }

    .button-10:disabled {
    cursor: auto;
    }
    </style>

    <!– HTML !–>
    <button class=”button-11″ role=”button”>Button 11</button>
    <!– CSS!–>
    <style>
    .button-11 {
    background: #FF4742;
    border: 1px solid #FF4742;
    border-radius: 6px;
    box-shadow: rgba(0, 0, 0, 0.1) 1px 2px 4px;
    box-sizing: border-box;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-family: nunito,roboto,proxima-nova,”proxima nova”,sans-serif;
    font-size: 16px;
    font-weight: 800;
    line-height: 16px;
    min-height: 40px;
    outline: 0;
    padding: 12px 14px;
    text-align: center;
    text-rendering: geometricprecision;
    text-transform: none;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    vertical-align: middle;
    }

    .button-11:hover,
    .button-11:active {
    background-color: initial;
    background-position: 0 0;
    color: #FF4742;
    }

    .button-11:active {
    opacity: .5;
    }
    </style>

    <!– HTML !–>
    <button class=”button-12″ role=”button”>Button 12</button>
    <!– CSS!–>
    <style>
    .button-12 {
    appearance: none;
    background-color: #000000;
    border: 2px solid #1A1A1A;
    border-radius: 15px;
    box-sizing: border-box;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-family: Roobert,-apple-system,BlinkMacSystemFont,”Segoe UI”,Helvetica,Arial,sans-serif,”Apple Color Emoji”,”Segoe UI Emoji”,”Segoe UI Symbol”;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    margin: 0;
    min-height: 60px;
    min-width: 0;
    outline: none;
    padding: 16px 24px;
    text-align: center;
    text-decoration: none;
    transition: all 300ms cubic-bezier(.23, 1, 0.32, 1);
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    width: 19%;
    will-change: transform;
    }

    .button-12:disabled {
    pointer-events: none;
    }

    .button-12:hover {
    box-shadow: rgba(0, 0, 0, 0.25) 0 8px 15px;
    transform: translateY(-2px);
    }

    .button-12:active {
    box-shadow: none;
    transform: translateY(0);
    }
    </style>

    <!– HTML !–>
    <button class=”button-13″ role=”button”>Button 13</button>
    <!– CSS!–>
    <style>
    .button-13 {
    appearance: none;
    background-color: transparent;
    border: 2px solid #1A1A1A;
    border-radius: 15px;
    box-sizing: border-box;
    color: #3B3B3B;
    cursor: pointer;
    display: inline-block;
    font-family: Roobert,-apple-system,BlinkMacSystemFont,”Segoe UI”,Helvetica,Arial,sans-serif,”Apple Color Emoji”,”Segoe UI Emoji”,”Segoe UI Symbol”;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    margin: 0;
    min-height: 60px;
    min-width: 0;
    outline: none;
    padding: 16px 24px;
    text-align: center;
    text-decoration: none;
    transition: all 300ms cubic-bezier(.23, 1, 0.32, 1);
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    width: 19%;
    will-change: transform;
    }

    .button-13:disabled {
    pointer-events: none;
    }

    .button-13:hover {
    color: #fff;
    background-color: #1A1A1A;
    box-shadow: rgba(0, 0, 0, 0.25) 0 8px 15px;
    transform: translateY(-2px);
    }

    .button-13:active {
    box-shadow: none;
    transform: translateY(0);
    }
    </style>

    <!– HTML !–>
    <button class=”button-14″ role=”button”>Button 14</button>
    <!– CSS!–>
    <style>
    .button-14 {
    align-items: center;
    appearance: none;
    background-image: radial-gradient(100% 100% at 100% 0, #5adaff 0, #5468ff 100%);
    border: 0;
    border-radius: 6px;
    box-shadow: rgba(45, 35, 66, .4) 0 2px 4px,rgba(45, 35, 66, .3) 0 7px 13px -3px,rgba(58, 65, 111, .5) 0 -3px 0 inset;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-family: “JetBrains Mono”,monospace;
    height: 48px;
    justify-content: center;
    line-height: 1;
    list-style: none;
    overflow: hidden;
    padding-left: 16px;
    padding-right: 16px;
    position: relative;
    text-align: left;
    text-decoration: none;
    transition: box-shadow .15s,transform .15s;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    white-space: nowrap;
    will-change: box-shadow,transform;
    font-size: 18px;
    }

    .button-14:focus {
    box-shadow: #3c4fe0 0 0 0 1.5px inset, rgba(45, 35, 66, .4) 0 2px 4px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #3c4fe0 0 -3px 0 inset;
    }

    .button-14:hover {
    box-shadow: rgba(45, 35, 66, .4) 0 4px 8px, rgba(45, 35, 66, .3) 0 7px 13px -3px, #3c4fe0 0 -3px 0 inset;
    transform: translateY(-2px);
    }

    .button-14:active {
    box-shadow: #3c4fe0 0 3px 7px inset;
    transform: translateY(2px);
    }
    </style>

    <!– HTML !–>
    <button class=”button-15″ role=”button”>Button 15</button>
    <!– CSS!–>
    <style>
    .button-15 {
    align-items: center;
    appearance: none;
    background-color: #FCFCFD;
    border-radius: 4px;
    border-width: 0;
    box-shadow: rgba(45, 35, 66, 0.4) 0 2px 4px,rgba(45, 35, 66, 0.3) 0 7px 13px -3px,#D6D6E7 0 -3px 0 inset;
    box-sizing: border-box;
    color: #36395A;
    cursor: pointer;
    display: inline-flex;
    font-family: “JetBrains Mono”,monospace;
    height: 48px;
    justify-content: center;
    line-height: 1;
    list-style: none;
    overflow: hidden;
    padding-left: 16px;
    padding-right: 16px;
    position: relative;
    text-align: left;
    text-decoration: none;
    transition: box-shadow .15s,transform .15s;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    white-space: nowrap;
    will-change: box-shadow,transform;
    font-size: 18px;
    }

    .button-15:focus {
    box-shadow: #D6D6E7 0 0 0 1.5px inset, rgba(45, 35, 66, 0.4) 0 2px 4px, rgba(45, 35, 66, 0.3) 0 7px 13px -3px, #D6D6E7 0 -3px 0 inset;
    }

    .button-15:hover {
    box-shadow: rgba(45, 35, 66, 0.4) 0 4px 8px, rgba(45, 35, 66, 0.3) 0 7px 13px -3px, #D6D6E7 0 -3px 0 inset;
    transform: translateY(-2px);
    }

    .button-15:active {
    box-shadow: #D6D6E7 0 3px 7px inset;
    transform: translateY(2px);
    }
    </style>

    <!– HTML !–>
    <button class=”button-16″ role=”button”>Button 16</button>
    <!– CSS!–>
    <style>
    .button-16 {
    background-color: #222;
    border-radius: 4px;
    border-style: none;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-family: “Farfetch Basis”,”Helvetica Neue”,Arial,sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    margin: 0;
    max-width: none;
    min-height: 44px;
    min-width: 10px;
    outline: none;
    overflow: hidden;
    padding: 9px 20px 8px;
    position: relative;
    text-align: center;
    text-transform: none;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    width: 19%;
    }

    .button-16:hover,
    .button-16:focus {
    opacity: .75;
    }
    </style>

    <!– HTML !–>
    <button class=”button-17″ role=”button”>Button 17</button>
    <!– CSS!–>
    <style>
    .button-17 {
    background-color: #fff000;
    border-radius: 12px;
    color: #000;
    cursor: pointer;
    font-weight: bold;
    padding: 10px 15px;
    text-align: center;
    transition: 200ms;
    width: 16%;
    box-sizing: border-box;
    border: 0;
    font-size: 16px;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    }

    .button-17:not(:disabled):hover,
    .button-17:not(:disabled):focus {
    outline: 0;
    background: #f4e603;
    box-shadow: 0 0 0 2px rgba(0,0,0,.2), 0 3px 8px 0 rgba(0,0,0,.15);
    }

    .button-17:disabled {
    filter: saturate(0.2) opacity(0.5);
    cursor: not-allowed;
    }
    </style>

    <!– HTML !–>
    <button class=”button-18″ role=”button”>Button 18</button>
    <!– CSS!–>
    <style>
    .button-18 {
    background-color: #c2fbd7;
    border-radius: 100px;
    box-shadow: rgba(44, 187, 99, .2) 0 -25px 18px -14px inset,rgba(44, 187, 99, .15) 0 1px 2px,rgba(44, 187, 99, .15) 0 2px 4px,rgba(44, 187, 99, .15) 0 4px 8px,rgba(44, 187, 99, .15) 0 8px 16px,rgba(44, 187, 99, .15) 0 16px 32px;
    color: green;
    cursor: pointer;
    display: inline-block;
    font-family: CerebriSans-Regular,-apple-system,system-ui,Roboto,sans-serif;
    padding: 7px 20px;
    text-align: center;
    text-decoration: none;
    transition: all 250ms;
    border: 0;
    font-size: 16px;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    }

    .button-18:hover {
    box-shadow: rgba(44,187,99,.35) 0 -25px 18px -14px inset,rgba(44,187,99,.25) 0 1px 2px,rgba(44,187,99,.25) 0 2px 4px,rgba(44,187,99,.25) 0 4px 8px,rgba(44,187,99,.25) 0 8px 16px,rgba(44,187,99,.25) 0 16px 32px;
    transform: scale(1.05) rotate(-1deg);
    }
    </style>

    <!– HTML !–>
    <button class=”button-19″ role=”button”>Button 19</button>
    <!– CSS!–>
    <style>
    .button-19 {
    align-items: center;
    background-color: #fff;
    border-radius: 12px;
    box-shadow: transparent 0 0 0 3px,rgba(18, 18, 18, .1) 0 6px 20px;
    box-sizing: border-box;
    color: #121212;
    cursor: pointer;
    display: inline-flex;
    flex: 1 1 auto;
    font-family: Inter,sans-serif;
    font-size: 1.2rem;
    font-weight: 700;
    justify-content: center;
    line-height: 1;
    margin: 0;
    outline: none;
    padding: 1rem 1.2rem;
    text-align: center;
    text-decoration: none;
    transition: box-shadow .2s,-webkit-box-shadow .2s;
    white-space: nowrap;
    border: 0;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    }

    .button-19:hover {
    box-shadow: #121212 0 0 0 3px, transparent 0 0 0 0;
    }
    </style>

    <!– HTML !–>
    <button class=”button-20″ role=”button”>Button 20</button>
    <!– CSS!–>
    <style>
    .button-20 {
    background-color: #13aa52;
    border: 1px solid #13aa52;
    border-radius: 4px;
    box-shadow: rgba(0, 0, 0, .1) 0 2px 4px 0;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    font-family: “Akzidenz Grotesk BQ Medium”, -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 16px;
    font-weight: 400;
    outline: none;
    outline: 0;
    padding: 10px 25px;
    text-align: center;
    transform: translateY(0);
    transition: transform 150ms, box-shadow 150ms;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    }

    .button-20:hover {
    box-shadow: rgba(0, 0, 0, .15) 0 3px 9px 0;
    transform: translateY(-2px);
    }

    @media (min-width: 768px) {
    .button-20 {
    padding: 10px 30px;
    }
    }
    </style>






















    Notes: Get the code by clicking the button will copy the code and paste the code in the column below. Check the code is working or not




  • Cara Menampilkan Judul Postingan Saja di Halaman Utama/Home Page Blogspot

    www.laborblog.my.id - Postingan kali ini sudah ane terapin nih diblog ini dan cukup mudah cara untuk memastikannya. Sobat hanya tinggal klik halaman depan blog ane dan akan terlihat posting yang ada dihalaman depan blog ane hanya dengan Judul Posting aja

    Tangkapan Layar | Contoh
    Postingan kali ini sudah ane terapin nih diblog ini dan cukup mudah cara untuk memastikannya. Sobat hanya tinggal klik halaman depan blog ane dan akan terlihat posting yang ada dihalaman depan blog ane hanya dengan Judul Posting aja & satu lagi setiap tips dan trik blog yang ane sajikan diposting blog sudah diuji coba sebelumnya dan berhasil. hehehe
    Nah sekarang bagi Sobat yang berminat atau pengen mencoba silahkan ikuti langkah-langkah dibawah ini tapi sebelumnya lebih baik Sobat mendownload template Sobat Sebelum Memulai.
    1. Login ke Blogger.com -> Desain/Rancangan -> Edit HTML -> tambahkan kode di bawah sebelum kode </head>
    2. Copy/paste kode dibawah ini dan letakkan di atas kode </head>

    <style type=’text/css’>
    <b:if cond=’data:blog.pageType != &quot;static_page&quot;’><b:if cond=’data:blog.pageType !=
    &quot;item&quot;’>
    .post-body {display:none;}
    .post-footer {display:none;}
    .comment-link {display:none;}
    .post img {display:none;}
    .post blockquote {display:none;}
    .post blockquote p {display:none;}h2.date-header {display:none;}
    .post-labels {display:none;}
    .post-rating {display:none;}
    </b:if></b:if>
    </style>

    3. Klik Save Template, Selesai dan Lihat Hasilnya.
    Keterangan: Trik ini menurut beberapa pakar SEO, Untuk meringankan loading blog Sobat. Loading ringan akan menambah SEO di Google.

  • How to Make Responsive Floating Adsense Ads under the Blog

    www.laborblog.my.id - On this occasion laborblog.my.id will try to give tips on how to make floating ads easily. If you want to place floating ads, you have to be careful, don't let these ads disturb your blog visitors.

    Screenshot
    On this occasion laborblog.my.id will try to give tips on how to make floating ads easily. If you want to place floating ads, you have to be careful, don’t let these ads disturb your blog visitors.


    Sticky fixed ads placed at the bottom of the screen have a pretty solid click-through rate. Because of its performance, blog visitors will continue to see ads even if the article is scrolled down or up. , it will have a higher clickthrough potential (CTR). So how do you make a floating ad? Let’s see the tips below.
    Easy Ways to Make Floating Adsense Ads
    1. Open Blogger and Theme
    The first thing to do is go to blogger.com, then select a theme and edit the html code.
    Warning! : Before modifying the blog template, it is recommended to make a backup first, if there is an error it can be fixed immediately.
    2. Create Responsive Ads and Edit Code
    The second way, create a new ad in responsive format, then copy the adsense code into the text as marked below.

    <script type=’text/javascript’> $(document).ready(function() {$(&#39;img#closed&#39;).click(function(){$(&#39;#btm_banner&#39;).hide(90);});}); </script>
    <!–start: floating ads–>
    <div id=’floatads’ style=’width:100%;margin:auto; text-align:center;float:none;overflow:hidden; display:scroll;position:fixed; bottom:0;z-index:9999′>
    <div><a id=’close-floatads’ onclick=’document.getElementById(&apos;floatads&apos;).style.display = &apos;none&apos;;’ style=’cursor:pointer;’><img alt=’close’ src=’https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhclRDQZWqGVHmf1si9GTOlj-GAtAcNDA2TWpO4mrgttAwRDvOT74pcD_lBPspiNxF2SAO_EnysDgYmVA0EAVD4iR3yQ2AIstgUwROXMqEdoKhXk0fQhwWVmwhL2-JwQBjqzzdLNmqsK14/s1600/btn_close.gif’ title=’close button’/></a></div>
    <div style=’text-align:center;display:block;max-width:728px;height:auto;overflow:hidden;margin:auto’>
    <!–Script iklan–>
    [Masukaniklandisini]
    <!–Akhir script iklan–>
    </div>
    </div>
    <!–end: floating ads–>

    3. Put the above code above </body>
    When finished creating the script above, copy and paste it above the code </body>
    4. Save
    If the steps are done correctly, it will look like this .


    Accordingly the article “How to Make Responsive Floating Adsense Ads under the Blog” may be useful. If there is a tutorial that is not clear, you can leave a comment below. Happy reading and blogging

  • The Hidden Beauty Pria Laot Waterfall of the Aceh in Indonesia

    www.laborblog.my.id - Weh Island, Sabang is a tourist destination that is famous for its marine tourism, but there is another side of Sabang that you can visit besides the beach, namely a waterfall called Pria Laot Waterfall.

    The Hidden Beauty Pria Laot Waterfall of the Aceh in Indonesia
    Weh Island, Sabang is a tour destination that is famous for its marine tourism, but there is another side of Sabang that you can visit besides the beach, namely a waterfall called Pria Laot Waterfall. This waterfall is located in Pria Laot village, Iboih Village, Sabang, Aceh .
    Beautiful natural scenery is a mainstay tourist location. The name Pria Laot comes from the name of the village where this waterfall is located, or the village of Pria Laot. In this tourist spot, the Pria Laot waterfall has a pool of about 10 square meters with a depth of 1-1.5 meters, the height of the Pria Laot waterfall is only 15 meters so that the water spills are not too heavy. Relaxing swimming while enjoying the fresh forest air, is worth a try.
    Clean air in the middle of the forest will spoil you. The Pria Laot waterfall originates from Mount Sarong Keris which is located in the south of Weh Island. Some of the water also comes from Anak Laut Lake which crosses the Pria Laot River until it finally flows into this waterfall.
    Pria Laot Waterfall is only about 12 km from downtown Sabang to the zero kilometer point of Indonesia. A pamphlet with directions will take you there. Please park your vehicle and walk 1 km along the river. However, it is not recommended to come here on a rainy day, the large moss-covered rocks along the river can be dangerous for passers-by.
    Tourist attractions located in the forest will not make you tired and never get tired of walking, because you have the opportunity to enjoy the protected forest which is always so beautiful. Some of the wildlife you can see directly.


    If you want to see a very amazing sight that is impossible to forget, come to the Pria Laot waterfall from June to August, because this month you can see a waterfall decorated with butterflies that have just come out of their cocoons.

  • Cara Membuat Iklan Adsense Melayang Responsive dibawah Blog

    www.laborblog.my.id - Pada kesempatan kali ini saya akan memberikan tips cara membuat floating ads dengan mudah. Jika Anda ingin memasang iklan melayang, Anda harus berhati-hati, jangan sampai iklan tersebut mengganggu pengunjung blog Anda.

    Tangkapan Layar | Istimewa
    Pada kesempatan kali ini saya akan memberikan tips cara membuat floating ads dengan mudah. Jika Anda ingin memasang iklan melayang, Anda harus berhati-hati, jangan sampai iklan tersebut mengganggu pengunjung blog Anda.


    Iklan melayang tetap (sticky fixed ads) yang ditempatkan di bagian bawah layar memiliki nilai rasio klik-tayang yang cukup solid. Karena kinerjanya, pengunjung blog akan terus melihat iklan meskipun artikel di-scroll ke bawah atau ke atas. , itu akan memiliki potensi klik-tayang (RKT) yang lebih tinggi. Nah bagaimana cara membuat iklan melayang nya bro? Yuk simak tipsnya di bawah ini.
    Cara Mudah Membuat Iklan Adsense Melayang
    1. Buka Blogger dan Theme
    Hal pertama yang harus dilakukan adalah masuk ke blogger.com, lalu pilih theme dan edit kode htmlnya.
    Peringatan ! : Sebelum memodifikasi template blog, saran saya buat backup dulu, jika ada kesalahan bisa segera diperbaiki.
    2. Buat Iklan Responsive dan Edit Kode
    Cara kedua, buat iklan baru dalam format responsive, lalu copy kode adsense ke teks yang saya tandai di bawah ini.

    <script type=’text/javascript’>
    $(document).ready(function() {$(&#39;img#closed&#39;).click(function(){$(&#39;#btm_banner&#39;).hide(90);});});
    </script>
    <!–start: floating ads–>
    <div id=’floatads’ style=’width:100%;margin:auto; text-align:center;float:none;overflow:hidden; display:scroll;position:fixed; bottom:0;z-index:9999′>
    <div><a id=’close-floatads’ onclick=’document.getElementById(&apos;floatads&apos;).style.display = &apos;none&apos;;’ style=’cursor:pointer;’><img alt=’close’ src=’https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhclRDQZWqGVHmf1si9GTOlj-GAtAcNDA2TWpO4mrgttAwRDvOT74pcD_lBPspiNxF2SAO_EnysDgYmVA0EAVD4iR3yQ2AIstgUwROXMqEdoKhXk0fQhwWVmwhL2-JwQBjqzzdLNmqsK14/s1600/btn_close.gif’ title=’close button’/></a></div>
    <div style=’text-align:center;display:block;max-width:728px;height:auto;overflow:hidden;margin:auto’>
    <!–Script iklan–>
    [Masukaniklandisini]
    <!–Akhir script iklan–>
    </div>
    </div>
    <!–end: floating ads–>

    3. Letakkan Kode Diatas diatas </body>
    Setelah selesai membuat skrip di atas, salin dan letakkan di atas kode </body>
    4. Simpan
    Apabila langkah demi langkah dilakukan dengan tepat, maka akan terlihat seperti ini.


    Demikian artikel “Cara Membuat Iklan Adsense Melayang Responsif dibawah Blog” semoga bermanfaat. Jika ada tutorial yang kurang jelas bisa comment dibawah. Selamat membaca dan ngeblog…

  • Cara Mencegah Copy Paste Artikel Kecuali Kode dan Blockquote

    www.laborblog.my.id - Mencegah tindakan copy paste artikel dapat dilakukan dengan mudah dengan plugin atau script tertentu, lalu bagaimana cara mencegah copy paste kecuali tanda kutip atau kode  pada artikel tersebut?

    Ilustrasi
    Mencegah tindakan copy paste artikel dapat dilakukan dengan mudah dengan plugin atau script tertentu, lalu bagaimana cara mencegah copy paste kecuali tanda kutip atau kode pada artikel tersebut?
    Tindakan mengcopy paste konten blog orang lain mungkin bukan hal yang aneh lagi Saat ini banyak blogger yang menginginkan kesuksesan instan tanpa kerja keras.


    Untuk menghasilkan uang dengan blogging, kita membutuhkan lalu lintas. Traffic dapat dicapai dengan menyajikan konten viral atau berkualitas. Sayangnya, tidak semua blogger yang mengharapkan hasil langsung ingin bersusah payah membuat konten mereka sendiri.
    “Kalau ada yang mudah kenapa khawatir, toh semua yang ada di internet itu gratis, sudah jadi resikonya”. saya kira, ini adalah kalimat pembelaan dari banyak blogger yang melakukan kecurangan.
    Bagaimana mencegah copy dan paste posting blog?
    Ada cara mudah untuk mencegah orang lain menyalin postingan yang kita buat. laborblog.my.id sendiri sudah membuat cara untuk mencegah blogger mengcopy paste konten dengan menambahkan script tertentu. Cukup dengan menambahkan kode berikut di gadget HTML/JAVASCRIPT, pengunjung tidak akan bisa menggunakan shortcut CTRL+A untuk memilih konten artikel.

    <script src=’demo-to-prevent-copy-paste-on-blogger_files/googleapis.js’></script> <script type=’text/javascript’> if (typeof document.onselectstart!=”undefined” ) { document.onselectstart=new Function (“return false” ); } else { document.onmousedown=new Function (“return false” ); document.onmouseup=new Function (“return true” ); } </script>

    Selain itu, anda juga dapat menambahkan kode berikut untuk mencegah pencuri mengambil gambar dalam artikel dan menonaktifkan klik kanan menggunakan mouse.

    <script language=JavaScript>
    var message=”©laborblog.my.id 2021″; //Ganti dengan pesan kamu sendiri
    function clickIE4() {
    if (event.button==2) {
    alert (message);
    return false;
    }
    }
    function clickNS4(e) {
    if (document.layers||document.getElementById&&!document.all) {
    if (e.which==2||e.which==3) {
    alert(message);
    return false;
    }
    }
    }
    if (document.layers) {
    document.captureEvents(Event.MOUSEDOWN);
    document.onmousedown=clickNS4;
    } else if (document.all&&!document.getElementById) {
    document.onmousedown=clickIE4;
    }
    document.oncontextmenu=new Function(“alert(message);return false”)
    </script>

    Walaupun judulnya khusus untuk pengguna Blogger, cara ini juga bisa digunakan oleh pengguna WordPress – cukup tambahkan widget CUSTOM HTML di sidebar atau footer Anda, lalu salin kode di atas dan simpan.
    Bagi Anda yang lebih suka menggunakan plugin, Anda juga dapat mencegah copy paste artikel dengan plugin khusus seperti WP Content Copy Protection with Color Design, WP Content Copy Protection atau WP Content Copy Protection, dan No Right Click. secara otomatis sudah bisa melindungi konten blog Anda.
    Cara Mencegah Copy Paste Artikel Kecuali Kode dan Blockquote
    Satu masalah yang saya temui di kedua metode di atas adalah tidak ada kontrol atas apa yang diblokir – menggunakan skrip atau plugin akan membuat semua item blog tidak dapat disalin, sedangkan jika saya membagikan artikel dengan quote/blockquote atau kode? akan sangat merepotkan pembaca, jika ingin menyalin kode pada artikel tentang tutorial.
    Di beberapa plugin terdapat fungsi untuk memfilter bagian artikel mana yang bisa dicopy oleh pembaca, namun sayangnya fungsi ini hanya tersedia pada versi premium, untungnya ada cara yang murah!
    Untuk mencegah agar postingan tidak tercopy paste kecuali kode dan tanda kutip (blockquote), kita bisa menambahkan kode CSS berikut di template Blogger

    .post-outer {
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -khtml-user-select:none;
    -ms-user-select:none;
    -moz-user-select:none;
    }
    .post blockquote,.post pre,.post code{
    -webkit-touch-callout:text;
    -webkit-user-select:text;
    -khtml-user-select:text;
    -ms-user-select:text;
    -moz-user-select:text;
    }

    Sedangkan untuk pengguna WordPress kamu bisa menggunakan kode berikut:



    .entry-content {
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -khtml-user-select:none;
    -ms-user-select:none;
    -moz-user-select:none;
    }
    .entry-content blockquote, .entry-content pre, .entry-content code {
    -webkit-touch-callout:text;
    -webkit-user-select:text;
    -khtml-user-select:text;
    -ms-user-select:text;
    -moz-user-select:text;
    }

    CATATAN: Setiap tema/template memiliki class CSS yang berbeda. Dalam kode di atas menggunakan contoh yang paling umum. Jadi, jika kode ini tidak berfungsi, gunakan fungsi INSPECT browser Anda untuk menentukan class yang benar.

  • Cara Login Router Huawei HG8245H Indihome Via Ponsel dan PC

    www.laborblog.my.id - Sangat penting untuk mengetahui cara mengakses router Huawei. Hal ini dilakukan agar Anda bisa langsung mengakses internet menggunakan modem Huawei. Huawei sendiri adalah merek global dari China, menawarkan berbagai macam router dan perangkat jaringan nirkabel.

    Ilustrasi
    Sangat penting untuk mengetahui cara mengakses router Huawei. Hal ini dilakukan agar Anda bisa langsung mengakses internet menggunakan modem Huawei. Huawei sendiri adalah merek global dari China, menawarkan berbagai macam router dan perangkat jaringan nirkabel.
    Seperti yang kita ketahui, setiap router sendiri memiliki alamat yang berbeda untuk dapat mengakses menu utama, guna melakukan pengaturan konfigurasi pada jaringan Wifi.


    Router bekerja dengan sendirinya untuk menyalurkan kapasitas internet yang ditangkap pada titik akses, dan kemudian didistribusikan ke pengguna internet melalui jaringan WiFi. Cara Mengakses Router Huawei sebenarnya penting untuk memeriksa jaringan WiFi sehingga kita dapat mempelajari pengguna yang selalu terhubung ke akses WiFi Anda.
    Selain itu, saat ini beberapa layanan dari penyedia WiFi yang sama telah memberlakukan pembatasan akses Internet, yang juga dikenal sebagai FUP. Oleh karena itu, tanpa kontrol administrator, tentu saja Wifi Anda bisa digunakan oleh pengguna ilegal. Dalam hal ini, mereka dapat menghabiskan jatah FUP Wifi Anda. Di bawah ini kami akan mencoba menjelaskan metode login ke router Huawei, Anda dapat mengikuti instruksinya!
    Login Admin Untuk Modem Huawei HG8245H
    Di bawah ini kita akan mencoba mengakses router Huawei HG8245H. Ada 2 cara yang bisa dilakukan yaitu melalui Laptop/PC dan HP. Berikut ulasannya!
    1. Cara login ke akun administrator Huawei HG8245H Indihome melalui laptop/PC
    Untuk login ke router Huawei HG8245H menggunakan PC, ada beberapa langkah yang bisa anda coba sebagai berikut:
    Pertama-tama, silahkan buka web browser di perangkat PC Kamu.
    Silahkan buka http://192.168.100.1/.
    Isikan “telecomadmin” (tanpa tanda petik) di kolom username, dan “admintelecom” (tanpa tanda petik) di kolom password.
    Selanjutnya ketuk login.
    Setelah itu, Kamu akan dibawa langsung ke dalam panel admin.
    Selamat, Kamu pun sudah berhasil login ke router Huawei.
    2. Cara mengakses akun administrator Huawei HG8245H Indihome melalui Hp
    Selain mengakses router Huawei HG8245H melalui laptop, Anda juga dapat login menggunakan ponsel. Berikut ulasannya:
    Langkah pertama, silahkan jalankan aplikasi web browser pada perangkat Hpmu.
    Inputkan link http://192.168.100.1/ pada url address web browser-mu.
    Inputkan “admintelecom” (tanpa tanda petik) di kolom password dan “telecomadmin” (tanpa tanda petik) di kolom username.
    Lalu ketuk tombol login.
    Kamu pun akan dibawa langsung ke panel admin.
    Selesai.
    Dengan masuk ke router Huawei di atas, Anda akan masuk ke administrator router Wifi. Sebagai administrator, Anda harus membaca semua informasi yang ada di modem Anda. Jika modem Anda tiba-tiba kehilangan akses atau koneksi, Anda perlu memeriksa dan memperbaiki modem yang menunjukkan sinyal merah.
    Pentingnya Akses Admin Dengan Login Router Huawei
    Jika Anda mengubah kata sandi untuk akses administrator, misalnya, Anda lupa kata sandi Anda atau seseorang mengubah kata sandi Anda. Hal ini jelas dapat berdampak negatif. Mereka yang memiliki akses ke administrator router dapat dengan mudah mengubah kata sandi dan nama Wifi.
    Selain itu, pengguna juga dapat memantau dan memblokir orang yang dapat dengan mudah mengakses jaringan Wi-Fi nya. Tanpa akses administrator, Anda jelas tidak dapat mengontrol pengguna jaringan Wi-Fi Anda lagi. Jika Anda tidak dapat mengingat kata sandi administrator pada router modem Huawei, Anda akan memiliki sedikit masalah.
    Sebab memang tidak tersedia pilihan lupa password atau sejenisnya untuk menyelesaikan masalah ini. Selain pentingnya login ke router Huawei, Anda juga harus tahu cara mengatasi lupa kata sandi saat login ke administrator di router modem Huawei.
    Jika Anda kesulitan mengatasi lupa kata sandi, Anda tidak perlu khawatir lagi karena kami akan membagikan panduannya di bawah ini!
    Cara Atasi Lupa Password Admin Huawei HG8245H
    Berikut beberapa cara mengatasi Huawei HG8245H lupa password administrator yang bisa anda coba:
    Dalam kondisi aktif, silahkan lakukan reset modem Huawei dengan cara menekan sampai beberapa lama pada tombol – reset yang tertera di router modem Huawei HG8245H memakai jarum atau ballpoint.
    Silahkan hubungkan perangkat laptop atau PC ke Indihome, entah itu lewat LAN atau Wifi.
    Jika sudah, buka IP address 192.168.100.1.
    Di kolom login, tinggal isikan “Admin” (tanpa tanda petik dan huruf A kapital di awal) di kolom Account dan ketikkan “admin” (tanpa tanda petik dan huruf a-nya kecil) di kolom password.
    Ketuk login.
    Jika Anda sudah login dengan benar, cukup ubah password administrator di Indihome sesuai kebutuhan Anda. Agar tidak mudah lupa, simpan kata sandi di perangkat atau Anda dapat menyimpan kata sandi di catatan Anda. Jika Anda tidak memiliki akses ke jaringan Wi-Fi saat ingin mengakses halaman administrasi, Anda dapat menggunakan kabel LAN.
    Cara Memblokir Pengguna Wifi Indihome Huawei HG8245H
    Memiliki Indihome Wifi tentunya memudahkan kita untuk melakukan aktivitas dengan sangat mudah, tidak lagi membutuhkan kabel dan dapat diakses di berbagai perangkat. Berawal dari perangkat Hp, laptop, IP camera dan TV Box, namun dengan berkembangnya teknologi dan banyaknya aplikasi untuk mencari password untuk mengakses Indihome Wifi, mungkin akan semakin mudah bagi orang lain untuk menyusup ke Wifi Anda.
    Pada kenyataannya ketika terlalu banyak pengguna mengakses jaringan Wifimu, sementara pekerjaan Anda membutuhkan internet dengan cepat dan stabil, mau tak mau Kamu mencegah dan memblokir pengguna yang nakal.
    Berikut ulasan cara memblokir user Wifi Huawei HG8245H:
    Pertama, buka situs web modem untuk Huawei HG8245H melalui Google Chrome. Yang harus Anda lakukan adalah mengetik 192.168.100.1 dan Anda akan dibawa ke halaman login.
    Jika sudah, yang harus Anda lakukan adalah memasukkan kata sandi dengan “Admin” (tanpa tanda kutip) dan nama akun akan diisi dengan “admin” (tanpa tanda kutip). Ini adalah kata sandi standar, sehingga Anda dapat mengubahnya untuk alasan keamanan. Jika sudah diisi cukup login dan akan mengarah ke halaman yang berisi banyak opsi menu dan tab.
    Anda fokus saja, pergi ke “Status” dan tekan “Informasi Perangkat Pengguna (User Device Information)”. Dari sana Anda akan melihat semua perangkat yang telah mengakses jaringan Wifi Indihome Anda.
    – Harap tentukan perangkat mana yang akan diblokir atau ditambahkan ke daftar hitam (blacklist) Wi-Fi dengan menyalin “Alamat Mac (Mac Address)”, lalu buka “Keamanan (Security)” dan ketuk “Pengaturan filter WLAN Mac (WLAN Mac Filter Configuration)”, lalu ketuk “New”.
    Tempelkan “Mac Address” tadi yang telah disalin sebelumnya, tekan “Apply”.
    Silahkan ceklis pada pilihan “Enable WLAN Mac Filter Configuration” dan perangkat yang sudah dipilih tadi akan langsung terblokir.
    Selesai, kini Kamu sudah terbebas dari pengguna gelap yang mengakses Wifi Indihome Kamu.
    Jika Anda ingin membuka blokir perangkat yang telah ditentukan, Anda dapat terlebih dahulu menghilangkan tanda centang yang bertuliskan “Enable WLAN MAC Filter Configuration” . Artinya, jika Anda hanya membukanya sementara, karena Anda mungkin ingin menguncinya lagi.


    Namun, jika Anda ingin menghapusnya secara permanen, Anda dapat mengklik opsi “delete”, cukup centang di sisi kiri daftar hitam.
    Ini adalah ulasan tentang cara mengakses router Huawei HG8245H yang dapat Anda coba untuk mengakses dan mengelola administrator modem Huawei. Semoga bermanfaat!

  • Cara Memasang Komentar Facebook di Blog atau Web

    www.laborblog.my.id - Memasang Komentar Facebook ke Blogger dan Web sudah banyak dijelaskan dan digunakan oleh para blogger karena sebagian besar pengguna internet selalu login ke akun Facebook mereka, sehingga memudahkan pengunjung blog untuk berkomentar menggunakan akun Facebook nya.

    Tangkapan Layar | Istimewa
    Memasang Komentar Facebook ke Blogger dan Web sudah banyak dijelaskan dan digunakan oleh para blogger karena sebagian besar pengguna internet selalu login ke akun Facebook mereka, sehingga memudahkan pengunjung blog untuk berkomentar menggunakan akun Facebook nya.
    Berikut cara memasang komentar Facebook di blog Anda.
    LANGKAH:
    1. Masuk ke akun blogger.
    2. Pilih menu template – Edit HTML.
    3. Cari kode (CTRL+F) ini <div class=’comments’ id=’comments’>
    4. Lalu masukkan kode di bawah ini, di bawah kode <div class=’comments’ id=’comments’>

    <div title=’Comments made with Facebook’><fb:comments-count expr:href=’data:post.url’/> Comments </div> <div title=’Comments from Blogger’><data:post.numComments/> Comments </div> <div class=’clear’/></div> <div><p><b:if cond=’data:blog.pageType == “item”‘></p> <div id=’fb-root’/><fb:comments expr:href=’data:post.url’ num_posts=’2′ width=’400’/></b:if></div>

    5. Cari dan ganti kata “ID FACEBOOK ANDA” dengan ID Facebook atau ID Fan Page Anda.
    6. Simpan template, dan coba. Semoga berhasil

  • Bagaimana Cara Menghilangkan Kode ?m=1 atau ?m=0 Url Blogger

    www.laborblog.my.id - Pernahkah Anda memperhatikan bahwa URL blog pada platform Blogger memiliki kode unik yang diakhiri dengan (?m=1 atau ?m=0) dan kode tersebut secara otomatis ditampilkan ketika Anda mengakses URL dari home sebuah blog.

    Ilustrasi
    Pernahkah Anda memperhatikan bahwa URL blog pada platform Blogger memiliki kode unik yang diakhiri dengan (?m=1 atau ?m=0) dan kode tersebut secara otomatis ditampilkan ketika Anda mengakses URL dari home sebuah blog. Misalnya, blog ini memiliki URL home https://www.laborblog.my.id/?m=1 atau https://www.laborblog.my.id/?m=0.


    Jadi apa arti dari kode-kode ini?
    Kode akhiran ini hanya dimaksudkan untuk menunjukkan identitas perangkat yang digunakan seseorang untuk mengakses blog. Jika kode akhiran ditampilkan ?m=1, berarti Anda mengakses blog melalui perangkat seluler, jika kode ditampilkan ?m=0 berarti Anda mengakses blog melalui perangkat PC.
    Mengapa Kode Akhiran ?m=1 Url Blogger Dihilangkan?
    Salah satu alasan utama mengapa kode akhiran ?m=1 harus dihilangkan adalah karena kode tersebut dapat mengakibatkan duplikat konten di blog. Juga, menghapus kode url blogger dapat meningkatkan SEO di blog itu sendiri, yang masih dipercaya oleh beberapa blogger.
    Namun, apakah itu benar? Dan apakah benar ini berhubungan langsung dengan SEO?
    Menurut pendapat saya atau pribadi, pernyataan seperti di atas yang menyarankan kode ?m=1 atau ?m=0 dapat menyebabkan duplikat konten di blog tidak benar tetapi juga tidak sepenuhnya salah.
    Pendapat para Blogger hanyalah sebagian dari spekulasi dan asumsi sederhana bahwa mereka mungkin hanya akan mengalami kesulitan ketika URL blog mereka masih memiliki lampiran ?m=1 atau ?m=0. Jadi menurut mereka penyebabnya kira-kira seperti ini.
    Fakta bahwa kebanyakan blogger mengabaikan poin ini dan kebanyakan blogger lain tidak pernah mengalami masalah seperti duplikat konten yang disebabkan oleh kode akhiran ?m=1 atau ?m=0.
    Logika saya mengatakan itu seperti trik peringkas URL blog, terutama platform blogger, di mana semua URL yang dapat diakses home memiliki kode akhiran ?m=1 atau ?m=0. Jadi dengan menghilangkan kode tersebut, URL blog terlihat pendek dan rapi.
    Selain itu, dapatkah kode-kode ini berhubungan dengan SEO? Bahkan ada yang mengatakan bahwa menghilangkan kode akhiran dapat meningkatkan SEO pada sebuah blog. Ini pendapat yang agak tidak relevan dan ternyata menghilangkan kode akhiran ?m=1 atau ?m=0 tidak bisa menaikkan atau menurunkan rangking blog.
    Jawaban paling logis dari pernyataan di atas adalah jika Anda ingin meningkatkan SEO blog Anda, maka buatlah konten yang berkualitas, yang dengan sendirinya sudah cukup untuk meningkatkan peringkat blog Anda di serp engine research.
    Jadi mengapa saya terus berbagi Bagaimana cara menghilangkan Kode ?m=1 atau ?m=0 ?
    Alasannya sangat sederhana, saya ingin membagikan tip ini untuk Anda yang ingin mempersingkat url atau tautan blog agar lebih pendek saat login dari perangkat seluler atau desktop. Sekali lagi, saya menekankan bahwa dengan kode ?m=1 atau ?m=0 tidak akan mempengaruhi SEO blog Anda.
    Oleh karena itu sebelum mencoba cara ini ada baiknya anda membaca artikel diatas terlebih dahulu agar anda tidak gagal paham nantinya.
    Cara Menghilangkan Kode ?m=1 atau ?m=0
    1. Silahkan buka akun Blogger Anda masing-masing.
    2. Lalu pergi ke bagian Tema > Edit Html. Kemudian salin dan tempel kode di bawah ini tepat di atas </body>

    <script type=’text/javascript’>
    var uri = window.location.toString();if (uri.indexOf(&quot;?m=1&quot;,&quot;?m=1&quot;) &gt; 0) {var clean_uri = uri.substring(0, uri.indexOf(&quot;?m=1&quot;));window.history.replaceState({}, document.title, clean_uri);}
    </script>



    3. Simpan tema dan coba akses url blog, kode akhiran tidak akan lagi dilampirkan ke url blog Anda.
    Cukup sekian artikel tentang “Bagaimana Cara Menghilangkan Kode ?m=1 atau ?m=0 Url Blogger”. Semoga bermanfaat. Terima kasih