Cara Membuat Random Style CSS Di NextWapBlog

Whidie ID 12 Feb 2018 - 16:18 5 Komentar
thumbnail

Klik Baca NWB | Pernahkan kamu mengunjungi situs http://stevendie.xtgem.com? yah situs terkeren dari platform Xtgem ini mempunyai sebuah fitur unik. Fitur uniknya adalah, setiap kali kita mengklik link di situs tersebut, maka css wap itu akan berganti secara otomatis. Wihh keren bukan? nah itulah yang dinamakan "Random Style CSS".

Jika kamu sedang mengunjungi blog saya ini via Mobile jangan bingung yak, kenapa warna css tiba-tiba dapat berganti secara otomatis. Sebenarnya fitur ini merupakan sebuah fitur langka dari sekian banyak blog builder lokal di Indonesia.

Kode yang digunakan untuk membuat random style css ini hanyalah dengan memanfaatkan kode Twig yang merupakan fitur tersembunyi dari platform NextWapBlog. Kebanyakan para user menganggap Twig hanyalah sebuah kode yang digunakan untuk memunculkan post, komen, dan komponen penting lainnya. Tapi, sebenarnya Twig code ini sangat berguna sekali jika dipahami dengan baik, langsung saja kita perhatikan contoh kodenya.

Contoh
{% set warna = ["red","green","blue"] %}
<p style="color: {{ random(warna) }}"> Contoh paragraph.</p>
Copas :

NB : Pastekan di template editor, jangan di navigasi/post karena twig kodenya tidak akan jalan

Baiklah, sekarang akan saya terangkan kode diatas.

- {% set warna %} adalah proses membuat variabel yang bernama "warna".

- {% set warna = ["red","green","blue"] %} adalah proses memasukan nilai ke variabel, dalam data diatas diketahui valuenya adalah : red, green & blue yang merupakan kode warna dalam bahasa inggris, maka variabel ini dinamakan array karena valuenya yang lebih dari 1.

- <p> membuat paragraf.

- <p style="color: "> contoh Teks </p> membuat paragraf yang warna teks diubah, color: diatas belum mempunyai nilai, jadi kita akan menambahkan warna acak.

- <p style="color: {{ random(warna) }}"> Contoh teks </p> fungsi dari {{ random() }} adalah mengacak data array, lalu kita masukan variabel warna tadi menjadi {{ random(warna) }} sehingga warna teks dapat berwarna merah, hijau atau biru.

Nah jadi begitulah penjelasaannya, tapi bukan hanya value itu saja yang bisa dimasukan. Kamu juga dapat menulis value lainnya seperti :
- URL/Partner
- Kode Warna (hex/rgb/inggris/dll)
- Tag HTML/CSS/JS dll
- Ikon, gambar dll

So, jadi bikin random style css gimana? cukup ganti value menjadi url css dan taruh di <link rel="stylesheet" href="DISINI"/>, masih belum paham? lihat contohnya dibawah :
{% set urlcss = ["http://wapku.com/cssku.css","http://wapku.com/cssdia.css,"http://wapku.com/cssmereka.css","Dan seterusnya"] %}

<link rel="stylesheet" href="{{ random(urlcss) }}"/>

Atau

<style>
@import url("{{ random(urlcss) }}");
</style>

NB : Harap taruh kodenya di bagian <body> jangan di bagian <head>

So mengertikan? ternyata bukan kata ajaib tapi random yang digunakan, hehe :biggrin:. Dengan adanya fitur langka ini semoga blog NWB mu makin keren yak dan jangan lupa modifikasi terus kodenya, semoga bermanfaat.



Ettsss tunggu dulu, jangan lupa add akun medsos saya yah hehehe :redface: tenang fast confirm/folbek.
- Facebook | Twitter

Keywords : Cara membuat random style css dengan twig code, Cara membuat random style css di nextwapblog, Fitur langka nextwapblog, Membuat style acak dengan twig.

Komentar

5 Tanggapan dari "Cara Membuat Random Style CSS Di NextWapBlog"

Komentar baru











Please refresh...

Smiley

aplikasi youtube downloader