Membuat Link Bio ala Linktr.ee Menggunakan Domain Sendiri

Cara membuat halaman yang memuat beberapa link sekaligus. Biasanya para blogger memanfaatkan website pihak ketiga, seperti yang populer linktr.ee. Contoh pemanfaatan linktr.ee sebagai berikut:

https://linktr.ee/dalilahcustom

Keren, kan? Bisa dipajang di instagram yang punya keterbatasan maksimal 1 link aktif saja. Sehingga, dengan pemanfaatan tersebut, bisa merangkul banyak link tujuan sekaligus. Bisa link kerja sama yang mengarah ke WA, channel youtube, sosmed, dsb.

Nah, tapi, bagaimana kalau buat di blog sendiri pakai theme bloggerkece.com? Tentu bisa. Jadi, kalian tak perlu buat di layanan sejenis linktr.ee. Melainkan cukup pakai page menggunakan blog dengan domain sendiri. Contoh hasilnya berikut ini:

https://kulinerhalalmalang.com/
Mengadopsi https://linktr.ee/dalilahcustom

Lebih asik pakai domain sendiri, bukan?. Yuk, simak langkah praktis dan mudahnya di bawah ini.

1. Siapkan page baru dengan mengakses Pages – Add New.

Kemudian buat nama page bebas, misal:
Bio – namadomain.com/bio
Me – namadomain.com/me
Link – namadomain.com/link, dst
Semakin pendek, makin bagus, tidak susah diketik ulang.

2. Kemudian, copy kode di bawah ini.

[vc_row content_placement=”middle” height=”full” width=”full” color_scheme=”custom” us_bg_color=”#14236d” el_class=”bloggerkece-background”][vc_column][us_single_image image=”15″ size=”full” align=”center” el_class=”bloggerkece-profil-foto”][vc_column_text el_class=”bloggerkece-akun”]@kulinerhalalmalang[/vc_column_text][us_btn text=”Tentang Kami” link=”url:https%3A%2F%2Fwww.instagram.com%2Fkulinerhalalmalang%2F|||” color=”white” align=”center” el_class=”bloggerkece-tombol”][us_btn text=”Kelas Online” link=”url:https%3A%2F%2Fwww.instagram.com%2Fkulinerhalalmalang%2F|||” color=”white” align=”center” el_class=”bloggerkece-tombol”][us_btn text=”Media Partner” link=”url:https%3A%2F%2Fwww.instagram.com%2Fkulinerhalalmalang%2F|||” color=”white” align=”center” el_class=”bloggerkece-tombol”][us_btn text=”Sponsorship” link=”url:https%3A%2F%2Fwww.instagram.com%2Fkulinerhalalmalang%2F|||” color=”white” align=”center” el_class=”bloggerkece-tombol”][us_social_links style=”solid_circle” align=”center” items=”%5B%7B%22type%22%3A%22whatsapp%22%2C%22url%22%3A%22https%3A%2F%2Fapi.whatsapp.com%2Fsend%3Fphone%3D6289682193220%26text%3DAssalamualaikum%252c%2520Lur%2521%26source%3D%26data%3D%26app_absent%3D%22%2C%22color%22%3A%22%231abc9c%22%2C%22icon%22%3A%22fas%7Cstar%22%7D%2C%7B%22type%22%3A%22facebook%22%2C%22url%22%3A%22https%3A%2F%2Fwww.facebook.com%2Fkulinerhalalmalang%22%2C%22color%22%3A%22%231abc9c%22%2C%22icon%22%3A%22fas%7Cstar%22%7D%2C%7B%22type%22%3A%22instagram%22%2C%22url%22%3A%22https%3A%2F%2Fwww.instagram.com%2Fkulinerhalalmalang%22%2C%22color%22%3A%22%231abc9c%22%2C%22icon%22%3A%22fas%7Cstar%22%7D%2C%7B%22type%22%3A%22email%22%2C%22url%22%3A%22kulinerhalalmalang%40gmail.com%22%2C%22color%22%3A%22%231abc9c%22%2C%22icon%22%3A%22fas%7Cstar%22%7D%5D”][/vc_column][/vc_row]

3. Setelah copy kode di atas, paste pada mode Visual (visual yah, jangan text). Maka, hasilnya terlihat seperti di bawah ini:

4. Kemdian, klik Backend Editor. Maka, tampilannya akan seperti ini:

5. Klik icon gear di pojok yang dilingkari merah. Akan muncul pop up berikut:

6. Untuk isi custom CSS di atas, kamu bisa menggunakan kode di bawah ini. Copy semuanya dan paste seperti gambar sebelumnya.

.bloggerkece-profil-foto {margin: 0 auto 16px !important; border-radius: 50%; min-width: 96px; min-height: 96px; max-width: 96px; max-height: 96px;}
.bloggerkece-background {background-color:  #3d3b3c ;}
.bloggerkece-background .l-section-h {padding-top: 35px !important;}
.bloggerkece-akun {font-weight: 700; font-size: 16px; letter-spacing: 0px; color: #ffffff; text-align: center; margin: 0 auto 20px;}
.bloggerkece-akun p {margin-bottom: 24.5px !important;cursor: pointer; max-width: 300px; margin: 0 auto;}
.bloggerkece-tombol {min-width: 680px; border-radius: 0; min-height: 58px; line-height: 58px !important; margin-bottom: 11.2px;}
.bloggerkece-tombol.w-btn {font-weight: 700; font-size: 16px;}
.bloggerkece-akun, .bloggerkece-tombol.w-btn {font-family: ‘Karla’, sans-serif;}
@media only screen and (max-width: 780px){
.bloggerkece-tombol {min-width: 95%;}
}

7.  Kemudian, klik Save changes. Taraaa, selamat, kamu sudah berhasil membuat kerangka desainnya. Selanjutnya, tinggal mengganti bagian di dalamnya. Mulai dari foto avatar, tombol beserta link tujuan.

Desain bisa kamu explorasi sendiri, seperti warna dsb. Kode warna yang ditandai merah #3d3b3c. Merupkan warna background abu-abunya. Silahkan ganti dengan kode warna tersebut, sesuai warna keinginan. Kamu bisa dapatkan ide warna Flat UI di https://flatuicolors.com