Showing posts with label Web Design. Show all posts
Showing posts with label Web Design. Show all posts

Monday, May 14, 2012

Cara Membuat Permalink Blogger

Cara Membuat Permalink Blogger

adda-info.blogspot.com


berbagi cara membuat permalink di blogger
sebelumnya saya mau kasih tahu apa itu permalink
Permalink atau permanen link tag adalah link permanen yang menuju halaman tertentu atau yang yang dituju . Sedangkan tujuan membuat permanen link  atau permalink tag di postingan adalah untuk menambah / memperkuat internal link pada artikel dan diharapkan mampu memperkuat / menambah target pencarian keyword di search engine. permalink juga merupakan penerapan teknik optimasi seo on page, sehingga permalink yang kita buat bisa juga disebut permalink tag seo.

Oke sekarang langsung ke TKP

Tutorial :


1.Login ke dashboard blogger anda, pilih Rancangan > Edit HTML, centang Expand widget template.
   Atau Template > Edit HTML > centang Expand Widget

2.Cari kode ]]></b:skin>  pada template kalian

3.Letakkan kode CSS dibawah ini diatas kode ]]></b:skin>

permalink-bloggerku
{border: 2px dashed #424242;
padding: 5px;
background: #fbfbef;-moz-border-radius:5px;}
permalink-bloggerku
{background:none;}
img.float-right {margin: 5px 0px 0 10px;}
img.float-left {margin: 5px 10px 0 0px;}

4.Kemudian cari kode <data:post.body/> pada template kalian . Letakkan code permalink dibawah ini dibawah kode <data:post.body/>. Jika template kalian sudah menggunakan Read More, maka kalian letakkan kode permalink dibawah kode <data:post.body/>  yang ke-2 .


<div class='permalink-bloggerku' style='padding:5px 5px 5px 5px; overflow: auto; width: auto; height: auto; text-align: justify;'>
<small>Anda sedang membaca artikel tentang <strong><u><data:blog.pageName/></u></strong> dan anda bisa menemukan artikel <data:blog.pageName/> ini dengan url <strong><data:post.url/></strong>. Anda boleh menyebarluaskan atau mengcopy artikel <strong><data:blog.pageName/></strong> ini jika memang bermanfaat bagi anda atau teman-teman anda,namun jangan lupa untuk mencantumkan link sumbernya.</small></div>


5.Preview untuk melihat hasil kalian apakah sudah berhasil atau belum.

contoh permalink


6.Jika anda ingin membuat url postingan pada permalink menjadi link aktif, sobat dapat mengganti kode

<data:post.url/>  dengan kode  <a expr:href='data:post.url'><data:post.url/></a>

7.Silahkan membuat kreasi pada jenis style border atau background warna sesuai keinginan anda. Mencoba membuat dengan kreasi sendiri tentunya akan lebih memuaskan hasilnya.

8.Simpan template anda / Save.


Selamat Mencoba dan Semoga Berhasil !!!

Jangan Lupa Berkunjung Kembali :D

Description: Cara Membuat Permalink Blogger Rating: 4.8 Reviewer: Unknown - Item Reviewed: Cara Membuat Permalink Blogger
Posted by: Ronnie Jr
Adda Info Updated at: 5/14/2012

Friday, May 11, 2012

Kustomisasi Situs Web Atau Blog


Kustomisasi Situs web atau blog


adda-info.blogspot.comApa yang dapat kita lakukan?
Saat ini, di dunia ini trendi, orang menjadi sangat tegang ketika mereka tidak melihat sepenuhnya rapi. Ini juga akan menjadi kasus dalam mendesain web.

Setiap orang pasti ingin website mereka untuk terlihat baik, jika tidak, untuk yang terbaik yang mereka bisa. Berikut adalah beberapa hal kita bisa melihat keluar ketika ingin membuat halaman Web terlihat profesional.








Skema warna dan Tema
adda-info.blogspot.com

Ketika merancang, selalu memilih warna yang cocok. Contoh warna yang senada akan memiliki latar belakang gelap, dengan kata-kata terlihat dan desain. Dengan tema gelap, cobalah untuk tidak mencampur warna-warna cerah terlalu banyak ke dalam desain. Apa yang kita jangan lakukan, adalah untuk mencampur dua warna yang sangat berbeda, seperti ungu dan kuning. Sekarang, tentu saja, akan bergantung pada tujuan dari situs web, tetapi dua warna yang terlalu mencolok bagi orang yang ingin itu terlihat lebih profesional.


adda-info.blogspot.com


Tema harus selalu sesuai dengan perusahaan atau lebih, organisasi / dll Jika situs itu dibuat untuk melayani sebuah perusahaan makanan, akan lebih bijaksana untuk tetap pada kategori tertentu, bukan untuk kembali ke tema yang berbeda, seperti mesin.

Font harus digunakan sehubungan dengan formalitas dari situs web. Font sans-serif sederhana akan cukup dalam banyak kasus. Kasus luar biasa seperti desain dan kelompok seni mungkin ingin menggunakan desain fantastis dan font. Tentu saja, itu hanya jika Anda tahu apa yang Anda lakukan.

Akhirnya, kita harus selalu mencoba untuk berpikir dari pengunjung , lihat cara mereka melihat. Resolusi dan ukuran file gambar jangan terlalu besar dalam hal ukuran. Hal ini untuk memungkinkan kompatibilitas maksimum dan memenuhi kebutuhan tamu kami.

Jadi, perencanaan adalah sesuatu yang kita harus selalu melakukan, sebelum mencoba sesuatu.

Description: Kustomisasi Situs Web Atau Blog Rating: 4.8 Reviewer: Unknown - Item Reviewed: Kustomisasi Situs Web Atau Blog
Posted by: Ronnie Jr
Adda Info Updated at: 5/11/2012

Saturday, May 5, 2012

Belajar CSS Part 1

Belajar CSS dasar

mau berbagi sedikit ilmu saja
yang suka dengan CSS
maaf kalau masih dasar harap di maklumi saya masih newbie.

Oke mari kita belajar


Untuk pengenalan Terlebih dahulu pengenalanCSS terlebih dahulu :
saya akan menjelaskan tentang arti dari CSS. CSS adalah suatu teknologi yang digunakan untuk memperindah tampilan halaman website (situs). Singkatnya dengan menggunakan Metoode CSS ini anda dengan mudah mengubah secara keseluruhan sekaligus memformat ulang situs anda.

CSS mempunyai 2 bagian utama yaitu selectors dan deklarasi. Yang dimaksud selectors biasanya element html yang ingin anda ubah, sedangkan deklarasi biasanya terdiri dari property dan nilai, properti sendiri adalah atribut style yang ingin anda ubah, dan setiap properti memiliki nilai. Untuk lebih jelasnya kita lihat contoh dibawah ini :


Setiap syntax css selalu diakhiri dengan titik koma, dan kelompok deklarasi dikelilingi oleh kurung kurawal {}

p {color:red;text-align:center;}


Untuk membuat CSS mudah dibaca,anda bisa menempatkan deklarasi pada satu baris seperti ini :


p {color:red;text-align:center;}


Selanjutnya adalah membuat komentar dalam CSS (CSS comment), comment digunakan untuk menjelaskan kode anda dan membantu ketika mengedit script. Namun, comment akan diabaikan oleh browser jadi kita harus menyembunyikannya. Coment ditandai dengan “ / * ” dan diakhiri dengan “ * / ”, perhatikan contoh pengaplikasian comment dibawah :


/* Ini adalah comment anda */



p

{

text-align:center;

/*Ini adalah comment anda*/

color:black;

font-family:arial;

}



Selamat mencoba !!

Description: Belajar CSS Part 1 Rating: 4.8 Reviewer: Unknown - Item Reviewed: Belajar CSS Part 1
Posted by: Ronnie Jr
Adda Info Updated at: 5/05/2012

Belajar HTML Part 1

Mari Belajar bersama membuat HTML
Sebelumnya saya kasih pengertian dati HTML.

Apa yang dimkasud dengan file HTML?
-    HTML merupakan kependekan dari Hyper Text markup Language
-    Sebuah file HTML merupakan sebuah file teks yang berisi tag-tag markup
-    Tag markup memberitahukan browser bagaimana harus menampilkan sebuah halaman
-    File HTML harus memiliki ekstensi htm atau html
-    File HTML dapat dibuat menggunakan editor teks yang biasa kamu pakai.

Oke mari kita mulai


  • Mulailah dengan membuka Notepad (di Windows XP atau 7  bagi yang belum pernah klik Start, Program, Accessories, Notepad).

Ketikkan teks berikut:
<html>
<head>
<title>Judul Halaman</title>
</head>
<body>
Ini halaman pertama saya. <b>Teks ini ditebalkan</b>
</body>
</html>

  • Simpan dengan nama “halamanku.htm” ( jangan lupa tambahkan tanda kutip ganda pada nama filenya. Kalau lupa maka nama filenya akan menggunakan ekstensi default .txt sehingga menjadi halamanku.htm.txt )
Penjelasan :
  1. Setiap tag diapit oleh tanda lebih kecil dan lebih besar. Kamu bisa melihat bahwa tag pertama adalah <html>. Tag HTML pada umumnya selalu memiliki pasangan yang memiliki tag sama dengan sedikit tambahan tanda garis miring “/”, dan kamu bisa melihat pasangan tag <html> di akhir script yaitu </html>.
  2. Tag <html> memberitahu browser bahwa inilah awal dari dokumen HTML. Tag pasangannya yaitu </html> menyatakan bahwa inilah akhir dari dokumen HTML.
  3. Teks di antara <head> dan </head> adalah teks informasi header. Informasi header ini tidak ditampilkan pada jendela browser.
  4. Teks di antara <title> adalah judul dokumen kamu. Judul ini akan ditampilkan di caption browser (lihat di bagian paling atas kanan dari browser kamu).
  5. Teks di antara tag <body> adalah teks yang akan ditampilkan pada jendela browser kamu.
  6. Dan terakhir, teks di antara <b> dan </b> akan ditampilkan dalam huruf tebal.
penjelasan mengenai ekstensinya. 


kita bisa membuat file HTML dengan 2 ekstension yaitu .htm dan .html :

  • Ekstensi .htm ditujukan untuk operating sistem jaman dulu yang hanya mensupport ekstensi 3 huruf. 
  • Ekstensi .html akan lebih aman digunakan jika OS dan aplikasinya support karena lebih jelas menunjukkan bahwa ini adalah file HTML.
Note : setiap kamu melakukan perubahan pada file HTML kamu, maka kamu harus me     refresh browser untuk melihat perubahan tampilannya.


Description: Belajar HTML Part 1 Rating: 4.8 Reviewer: Unknown - Item Reviewed: Belajar HTML Part 1
Posted by: Ronnie Jr
Adda Info Updated at: 5/05/2012

____________________________________