Membuat widget ucapan selamat pagi, siang dan malam secara otomatis diblog, tanpa basa basi, berikut kode nya.
1.Taruh Kode Berikut di atas </body>
<script type='text/javascript'>//<![CDATA[var thehours = new Date().getHours();var themessage;var quote;var color;var morning = ('Selamat Pagi <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhB7H_05jA3hBWfFU4wN3c1TNtyBtasRxLtYFVHrwBEY1WmRFIibZHEU2AfRiaSa1COWrZ6IE2YK3Ec6CGPoE32jSBoCXq5W5_jCwkCTDoFRY63Uo6gtxP7zdOWtFp1RqqFPwPnVjZNb8dT/s1600/sunrise.png"/>');var qmorning = 'Setiap hari ada sebuah inspirasi untuk di cermati, mari semangat pagi !';var cmorning = '#7FC583';var afternoon = ('Selamat siang <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE8KSjl1bAMYXT-pWSAoKPVdTPfRo-6hYI33IssYfBQAWRVklu2eJDQtsMGTOVINF_Z4V45JsFn1ujv06oi2JVjbGjZ_B42iAeeH6modx29QQhcXypzzvbBD8F4ZDPiFNMhe5OSOWztgtk/s500/sun.png"/>');var qafternoon = 'Jangan patah semangat mari bangkit dan buktikan kepada dunia';var cafternoon = '#ffc107';var evening = ('Selamat malam <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJ1Y-4LheJJy1-jCeSL6iv6IErsaA52v4GqzM43P-3TKju7WVxFPHO1pRinewWUcUJgu9lss0eoFDPwgtuWKR5E6L4NiQTY7kufD6DzcW8ivUYrHixmhZaGD3fSFpR5oSvLrQei8jadAuK/s1600/sunset.png""/>');var qevening = 'Jaga kesehatan dengan beristirahat yang cukup !';var cevening = '#FF4F70'; if (thehours >= 0 && thehours < 12) { themessage = morning; quote = qmorning; color = cmorning; } else if (thehours >= 12 && thehours < 18) { themessage = afternoon; quote = qafternoon; color = cafternoon; } else if (thehours >= 18 && thehours < 24) { themessage = evening; quote = qevening; color = cevening; }$('.small-text').append(themessage);$('.grettings p').append(quote);$('.greeting').css('border-left', '2.5px solid ' + color );//]]></script>2. Setelah itu copy code CSS dibawah ini dan paste diatas ]]></b:skin> atau </style>.
.greeting {background-color: #ffffff;border: 0;border-bottom: 1.5px solid;border-radius: 5px;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);}.greeting {background: #fff;padding: 15px;position: relative;border: 0;}.grettings .small-text {font-weight: 600;font-size: 15.5px;padding-right: 50px;display: block;}.grettings .small-text img {width: 40px;height: 40px;object-fit: cover;position: absolute;right: 14px;top: 50%;transform: translateY(-50%);pointer-events: none;user-select: none;}.grettings p {font-weight: normal;font-size: 13px;margin-bottom: 0;margin-top: 5px;line-height: 16px;padding-right: 50px;}3. Taruh Kode berikut ditempat manapun yang anda suka.
<div class='greeting'><div class='grettings'><div class='small-text'></div><p></p></div></div>4.selesai.
Jika ada yang ingin anda tanyakan cukup tanya saya di fb saya Klik disini.
* Kode di Update Pada Senin 27 April pukul 09.07 WIB
* Silahkan Ulangi Tutorial agar dapat merasakan perbedaannya