Skip to main content

Macam-macam Cara Membuat Link Lebih Unik

macam-macam link
Hi Sob! Bagaimana kabar kamu? Semoga semangat seperti saya yang lagi postig hari ini. Kali ini sejuta trik blogger akan coba sharing pengalaman saya tentang macam-macam cara membuat link lebih unik. Macam-macam di posting kali ini saya fokuskan pada singgle link. Singgle link ini artinya link yang kita buat terpisah tanpa dipengaruhi oleh CSS, Script, dan Jquery yang terpasang di template kita.

Ada macam-macam trik memodifikasi link agar kelihatan unik. Berikut beberapa contoh dalam posting saya yang lalu :
dan masih banyak lagi macam-macam membuat link yang belum sempat diposting. Karena saking banyaknya modifikasi link. Sebagai contoh link nuding, link hover, link open new tab, dan masih banyak lagi yang lain. Atau kalau masih kurang ya cari saja di google :D

Posting tentang macam-macam membuat link ini terinspirasi bagi saya sendiri yang kesulitan membuat 1 link saja yang unik tanpa dipengaruhi bawaan template. Nah bagi sahabat sejuta trik yang juga ingin membuat link 1 saja yang unik, berikut triknya.

Membuat link memang sangat mudah. Tetapi untuk trik kali ini adalah untuk singgle link atau 1 link yang kita utak-atik. Sebagai contoh cara membuat link adalah sebagai berikut :

A. Link Biasa

Sejuta Trik Blogger
Triknya adalah :
<a href="http://sejutatrik.blogspot.com/">Sejuta Trik Blogger</a>

B. Link Tebal

Sejuta Trik Blogger
kodenya :
<b><a href="http://sejutatrik.blogspot.com/">Sejuta Trik Blogger</a></b>
atau
<strong><a href="http://sejutatrik.blogspot.com/">Sejuta Trik Blogger</a></strong>

C. Membuat Link Membuka Tab Baru

Sejuta Trik Blogger
kodenya :
<a href="http://sejutatrik.blogspot.com/" target="_blank">Sejuta Trik Blogger</a>

D. Link Italic atau teks miring

Sejuta Trik Blogger
kodenya :
<a href="http://sejutatrik.blogspot.com/"><i>Sejuta Trik Blogger</i></a>

E. Link Berwarna

Sejuta Trik Blogger
kodenya :
<a href="http://sejutatrik.blogspot.com/" target="_blank"><span style="color: blue;">Sejuta Trik Blogger</span></a>
 

F. Link Menu Hover CSS 3

kodenya :
<style>
.coollinks a {
 display: inline-block;
 padding: 4px;
 outline: 0;
 color: #3a599d;
 -webkit-transition-duration: 0.35s;
 -moz-transition-duration: 0.35s;
 -o-transition-duration: 0.35s;
 transition-duration: 0.35s;
 -webkit-transition-property: -webkit-transform;
 -moz-transition-property: -moz-transform;
 -o-transition-property: -o-transform;
 transition-property: transform;
 -webkit-transform: scale(1) rotate(0);
 -moz-transform: scale(1) rotate(0);
 -o-transform: scale(1) rotate(0);
 transform: scale(1) rotate(0);
}
.coollinks #one:hover, #three:hover, #five:hover{
 -webkit-border-radius: 6px;
 -moz-border-radius: 6px;
 -o-border-radius: 6px;
 border-radius: 6px;
 -webkit-transform: scale(1.01) rotate(-1.1deg);
 -moz-transform: scale(1.01) rotate(-1.1deg);
 -o-transform: scale(1.01) rotate(-1.1deg);
 transform: scale(1.01) rotate(-1.1deg);
}
.coollinks #two:hover, #four:hover {
 -webkit-border-radius: 6px;
 -moz-border-radius: 6px;
 -o-border-radius: 6px;
 border-radius: 6px;
 -webkit-transform: scale(1.01) rotate(1.1deg);
 -moz-transform: scale(1.01) rotate(1.1deg);
 -o-transform: scale(1.01) rotate(1.1deg);
 transform: scale(1.01) rotate(1.1deg);
}
.coollinks #one:hover{
 background: #815782;
 text-decoration: none;
 color: #fff;}

.coollinks #two:hover {
 background: #62946d;
 text-decoration: none;
 color: #fff;
}
.coollinks #three:hover {
 background: #824c4a;
 text-decoration: none;
 color: #fff;
}
.coollinks #four:hover {
 background: #825f0c;
 text-decoration: none;
 color: #fff;
}
.coollinks #five:hover {
 background: #823a3a;
 text-decoration: none;
 color: #fff;
}
</style>

lalu tambahkan kode berkut di bawahnya :

<div class="coollinks">
<a href="http://sejutatrik.blogspot.com" id="one">Home</a>
<a href="http://sejutatrik.blogspot.com/2012/02/memasang-breadcrumb-google.html" id="two">Google Breadcrumb</a>
<a href="http://sejutatrik.blogspot.com/2010/10/daftar-isi-sejuta-trik.html" id="three">Sitemap</a>
<a href="http://sejutatrik.blogspot.com/2011/10/daftar-ping-service-terbaik.html" id="four">Ping Service</a>
<a href="http://www.givegoodweb.com/tools/page-check/index.php" id="five">Title H1 Ceck</a>
</div>


Home Google Breadcrumb Sitemap Ping Service Title H1 Ceck
Untuk trik 'F' sahabat bisa letakkan pada 'HTML' widget atau saat posting seperti milik saya ini.
Nah, bagi teman-teman yang memiliki trik lebih unik dari macam-macam cara membuat link di atas, mari berbagi. Akhir kata, Happy Blogging Friends! Cayo Blogger Indonesia. 
Labels:

Popular posts from this blog

Read Solo Leveling Chapter 103 English Translate

Read Manhwa Solo Leveling Chapter 103 English translation . Since a portal connecting our world to a world full of monsters and creatures of all kinds appeared, some people have acquired powers and the ability to hunt them: they are called hunters. The protagonist of the story, Sung Jin-Woo, is the weakest of the rank E hunters and barely stronger than a normal human. He is nicknamed by his fellow hunters as "the weakest". One day, he and other hunters find themselves trapped in an extremely dangerous dungeon, and only a few of them survive and manage to escape. Sung Jin-Woo himself hardly survives and is the only who completes all the trials in this dungeon. He then turns into a "player" who can now see an interface showing him quests. Will he succeed in becoming the most powerful hunter? Read Solo Leveling Chapter 103 Not released yet release date : January 2020 You may also like : Manhwa similiar to solo leveling Read solo leveling 103 s...
Read more

Read Manga Solo leveling 104 English Translation

Solo Leveling is a Korean novel manhwa written by Chu-Gong, It was serialized in Papyrus and later in KakaoPage and concluded with 14 volumes and 270 chapters. In April 13, 2018, a webtoon serialization started in Korean mobile site KakaoPage drawn by artists Hyeon - Gun and Jang Sung-Rak. Read Manhwa Manga Solo Leveling 104 capitulo 104 Kyoukai tells Ten to move so she can save Shin. Banyou starts yelling at the HSU for not chasing Riboku but Mouten and Ouhon can read the situation and they head where the soldiers are gathered. Ten asks what Kyoukai's going to do and she says that she knows of a 1000 year old technique that shares life forces but she hasn't tried it before and has never seen it actually work. But she says there's no other way. Flashback: Kyoukai is attempting this technique on a dead bird and Kyoushou asks her why she's trying such a dangerous technique. She says that since it's a technique that tries to bring the dead back t...
Read more

Profil Biodata dan Foto Rizky Billar

Muhammad Rizky Billar itu dia nama lahir serta nama asli dari actor dan model ganteng yang lebih dikenal dengan nama Rizky Billar . Rizky Billar merupakan aktor dan model kelahiran Medan, 12 Juli 1995. Rizky Billar sudah mulai terjun ke dunia hiburan sejak tahun 2014 jika tidak salah. Ia lalu mulai berakting di film Miss Call dan jadi supporting role di sinetron tahun 2015. Nama Rizky Billar kemudian mulai dikenal public setelah berperan jadi pemeran pendukung di sinetron Anak Jalanan sebagai Dendi, dan Jinny Oh Jinny Datang Lagi sebagai Riko. Kemudian Rizky Billar pun semakin dikenal namanya setelah menjadi pemeran utama di sinetron Ada Dua Cinta sebagai Bimo serta Topeng Kaca sebagai Arya. Cowok tampan berdarah Arab Indonesia ini adalah penggemar klub sepakbola Liverpool dan Real Madrid. Dan berikut ini Biodata Rizky Billar : Nama Lengkap : Muhammad Rizky Billar Nama Panggilan : Rizky, Billar Nama terkenal : Rizky Billar Tempat, Tanggal Lahir : Jakarta, 12 Juli 1995 Ag...
Read more