Copassite

Senin, 25 Juli 2011

TUTORIAL Membuat Situs Jejaring Sosial
0

Di sini saya akan membuat situs jejaring sosial
Sebelum Memulai cara pembuatannya mari di lihat demonya terlebih dahulu...

Contoh DEMO Di Sini
Email :demo@amnesianum.co.cc
Pass :demo12345

Contoh Admin DEMO : ADMIN
Username : admin
Password : admin12345

Syarat membuat situs Sosial Network
- Harus Sudah Punya Domain ( Gratisan / Berbayar)
- Harus Sudah Punya Hosting( Gartisan / Berbayar)
- Yang Paling Penting Harus Punya Script nya...

Download Script

Sebelum saya uplode ke hosting saya coba dlu di localhost
- Install Xampp / Appserver

Cara Pertama kamu Copas Script ke dalam xampp..

XAMPP-HTDOCS-Buat dlu foldernya, disini saya namakan (SITUS)-Paste kan script yg tadi ke dalam folder "Situs"-Ekstrak..

Ketik dengan nama : http://localhost/situs/install.php
Nanti akan terlihat seperti gambar di bawah ini

Resized to 94% (was 640 x 273) - Click image to enlarge Posted Image

Jika sudah terlihat installannya masukkan License Key Pilih salah satunya saja :
Seperti gambar di bawah ini:

Resized to 83% (was 726 x 477) - Click image to enlarge Posted Image

0708-8721-8374-0672
4026-0722-1156-0030
1334-9558-6682-0576
2498-0115-9735-0945
5105-9612-7889-4032

Klik Continue

Buat Database di Mysql
DISINI

Seperti Gambar Di Bawah ini

Setalah Kamu login Silahkan dibuat database baru
Seperti Gambar Di Bawah Ini:

Klik Create

Isikan Kotak Connect to MySQL Database
- MySQL Hostname : localhost
- MySQL Database Name : facebook
- MySQL Username : root
- MySQL Password : *****

Seperti Gambar Di bawah ini:

Resized to 83% (was 725 x 392) - Click image to enlarge Posted Image

Klik Connect to MySQL Database

Jika sudah sukses maka akan seperti gambar di bawah ini

Klik Continue

Resized to 78% (was 772 x 167) - Click image to enlarge Posted Image

Klik Continue

Jika Install 'an kamu sukses maka akan terlihat seperti gambar di bawah ini:

Resized to 82% (was 739 x 599) - Click image to enlarge Posted Image

Simpan Username dan Password terlebih dahulu
Username: admin
Password: knnwtl

http://localhost/situs/admin/

Resized to 87% (was 693 x 235) - Click image to enlarge Posted Image

Jika Sudah Disimpan [ Login to Control Panel ]
Seperti Gambar Berikut Ini

Setelah Selesai Install Delete "install.php" dan "installsql.php"

http://localhost/situs

Resized to 94% (was 640 x 304) - Click image to enlarge Posted Image

Setelah percobaan kamu di localhost berhasil silahkan di edit scriptnya sesuai keinginan kamu, dan buat sebagus mungkin..

setelah selesai di edit silahkan Uplode Scriptnya di Hosting kamu
cara uplodenya sama seperti saya uplode scriptnya di xampp..

Semoga Bermanfaat...!!!

http://rezamuzay.blogspot.com/2011/04/tutorial-membuat-situs-jejaring-sosial.html#

Jumat, 22 Juli 2011

Membuat Widget Lintas Berita di Blog
0

Menanggapi pertanyaan sobat ISS pada postingan widget sharing is sexy yang menanyakan perihal seputar pemasangan widget lintas berita di blog. Kebetulan saya belum pernah membahas masalah ini, dan sebenarnya widget lintas berita ini pernah saya pasang di blog ini karena beberapa hal saya hilangkan. Seperti kita ketahui, lintas berita merupakan situs portal tempat orang mempromosikan web atau blog mereka.

Hampir semua blogger menggunakan fasilitas lintas berita sebagai media untuk promosi blog atau istilah kasarnya menjadi benalu di lintas berita, dengan total ribuan halaman/pages yang terindex di google. Dengan begitu blog kita jadi ikut terkenal dan setidaknya mendapat cipratan traffic dari lintas berita. Untuk mempermudah dalam submit berita atau artikel blog, widget lintas berita ini mungkin bisa menjadi alternatif.

Cara pasangnya sangat mudah, coba perhatikan langkah-langkahnya berikut ini.

Pada Edit HTML, silahkan klik Expand Template Widget.
Letakkan kode css berikut ini diatas kode ]]></b:skin>

#lintas-berita { background:#ECE0F8; border:1px solid #cccdcd; margin:15px 0px 10px 0px; padding:10px; color:#000; font-weight:normal; }
.lintaskiri { float:left; margin:0px 15px 0px 0px; width:380px; }
.lintaskanan { text-align:center; }
Kemudian letakkan kode berikut setelah kode <data:post.body/> atau <p><data:post.body/></p> :

<div class='clearfix' id='lintas-berita'> <div class='lintaskiri'> Jika menurut sobat artikel ini bermanfaat, silahkan vote ke <strong>Lintas Berita</strong> agar artikel ini bisa di baca oleh orang lain. </div> <div class='lintaskanan'> <script type='text/javascript'>lb_skin = 'mode2'; </script> <script src='http://www.lintasberita.com/widget_vote/lintasberita.js' type='text/javascript'/> <noscript>Powered by www.lintasberita.com visit <a href='http://www.lintasberita.com'>Lintas Berita</a></noscript> </div> </div>
Simpan Template.

Perhatikan kode css yang berwarna merah, kode tersebut adalah lebar untuk widget sebelah kiri (widget untuk tulisan) harap disesuaikan dengan lebar template. Jika widget lintas berita muncul pada halaman depan blog, maka tambahkan kode

<b:if cond='data:blog.pageType == "item"'>
diantara kode yang berwarna hijau dan tutup dengan kode
</b:if>

Semoga berhasil.

Tutor Copast is Available Here

Cara Membuat Artikel Terkait
0

Untuk membuat artikel terkait atau related post, kita akan sedikit mengubek-ubek kode HTML template kita. Jadi seperti biasa saya sarankan untuk membackup template sobat terlebih dahulu sebelum membuat artikel terkait ini.

Buat blogger baru yang belum mengerti tentang artikel terkait akan saya beri sedikit gambaran, kurang lebihnya seperti ini, dalam setiap postingan tentunya kita akan mengelompokkan postingan kita dalam beberapa kelompok atau yang biasa disebut dengan label (kategori).

Artikel terkait itu biasanya yang saya tau selalu berada dalam 1 kelompok postingan yang di kategorikan, dan umumnya diletakkan di bagian bawah postingan.
Berikut tutorial singkatnya :

Login ke Blogger.
Klik Tata Letak.
Klik tab Edit HTML.
Kemudian klik Expand Template Widgets .
Cari kode yang seperti ini :

<p><data:post.body/></p>

atau jika bingung tekan Ctrl + F kemudian ketikkan kode berikut :

<data:post.body/>
Jika sobat sudah menggunakan read more pada template sobat, maka akan terdapat 2 kode <data:post.body/>.
Kemudian letakkan script berikut ini setelah kode <data:post.body/> yang pertama.

<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>

<div class='widget-content'>
<h3>Artikel Terkait</h3>
<br/>
<script type='text/javascript'>

var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 7;

maxNumberOfPostsPerLabel = 7;
maxNumberOfLabels = 3;

function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;

for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;

if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {

var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}

var labelArray = new Array();
var numLabel = 0;

<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";

var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>

</div>
</b:if>
Kemudian Save Template.

Tutor Copast is Available Here

Cara Membuat Postingan Tampil Hanya Judulnya Saja
0

Membuat tampilan artikel postingan di Halaman Utama Blog agar terlihat Minimalis atau hanya Judul artikel saja. Membuat tampilan blognya sesimple mungkin tapi berkualitas.. salah satunya modifikasi cuplikan artikel postingan diblog...

Oke.. langsung saja simak caranya...mudah saja... langkah-langkahnya sbb :

1. Login ke blogger > Rancangan > Edit HTML > Edit Template ( Centang Expand Template Widget ) ...tekan CTRL+F lalu cari " <data:post.title/> " ... jika sudah ketemu lalu tambahkan kode dibawah ini...

Lakukan Persis seperti contoh dibawah ini... Perhatikan ya cara penempatannya...

<div style='border: 0px solid rgb(250, 252, 252); margin: 10px 0px; padding: 10px; -moz-border-radius: 0px 0px 0px 0px; width: auto; height: auto; background-color: rgb(250, 252, 252); '>
      <h3 class='post-title entry-title'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link'><data:post.title/></a>
     <b:else/>
        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
        <b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h3>
</div>

    </b:if>

Ket :
background-color: rgb(250, 252, 252); = Warna Background-nya bisa kamu ubah sesuai keinginan .. >> cek warna disini

Jika sudah benar... Simpanlah template-nya..

TRik ini akan membuat Judul artikel postingan seperti gambar dibawah ini...

2. Beralih ke Rancangan > Elemen Halaman > Klik Edit pada Posting bLog.. Lalu aturlah seperti gambar di bawah ini.. atau aturlah seperti kemauan kalian sendiri...

3. Saya pakai editor entri baru dari blogger ( Cek editor kamu di Pengaturan > Dasar > Setting Global > Editor Entri > Pilih option Editor yang diperbarui..) lalu pada awal postingan (tambahkan) klik Insert Jump Break, baru setelahnya isilah dengan postingan kita... Simple kan.. :)

4. Selesai. Terbitkanlah postingan dan lihat hasilnya pada Halaman Utama Blogmu.

Tutor Copast is Available Here

Membuat Artikel Terkait
0

Integrasi Artikel Terkait (Versi 1.0)

Langkah 1
Login ke Blogger
Langkah 2
Pilih "Tata Letak - Edit HTML"
Langkah 3
Backup Template Blog untuk mengantisipasi kegagalan modifikasi template
Langkah 4
Jangan lupa check "Expand widget template"
Langkah 5
Masukan Cascading Stye Sheet (CSS) seperti dibawah ini:
Cari kode dibawah ini :

]]></b:skin>

Copy Paste (CoPas) kode dibawah ini tepat diatasnya :

#related-posts {
float : left;
width : 540px;
margin-top:20px;
margin-left : 5px;
margin-bottom:20px;
font : 11px Verdana;
margin-bottom:10px;
}
#related-posts .widget {
list-style-type : none;
margin : 5px 0 5px 0;
padding : 0;
}
#related-posts .widget h2, #related-posts h2 {
color : #940f04;
font-size : 20px;
font-weight : normal;
margin : 5px 7px 0;
padding : 0 0 5px;
}
#related-posts a {
color : #054474;
font-size : 11px;
text-decoration : none;
}
#related-posts a:hover {
color : #054474;
text-decoration : none;
}
#related-posts ul {
border : medium none;
margin : 10px;
padding : 0;
}
#related-posts ul li {
display : block;
background : url("http://dedehendriono.googlepages.com/weed-bullet.gif") no-repeat 0 0;
margin : 0;
padding-top : 0;
padding-right : 0;
padding-bottom : 1px;
padding-left : 16px;
margin-bottom : 5px;
line-height : 2em;
border-bottom:1px dotted #cccccc;
}

Langkah 6
Sebaiknya simpan terlebih dahulu template untuk mencegah terjadinya error template
Langkah 7
Cari kode dibawah ini :

</head>

Langkah 8
Masukan link dibawah ini tepat diatas langkah 7 :

<script src='http://hensblog.googlecode.com/files/artikelterkait.js' type='text/javascript'/>

Langkah 9
Cari kode dibawah ini :

<data:post.body/>

Langkah 10
Masukakan kode dibawah ini tepat dibawah langkah 9 :

<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Artikel Terkait : </b></font>
<font color='#FFFFFF'>
<b:loop values='data:post.labels' var='label'>
<data:label.name/>
<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot;  + data:label.name +  &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/>
</b:if>
</b:loop>
</font>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</div>
</b:if>

Langkah 11
Simpanlah template dan preview blog

Keterangan :

Silahkan ubah kode CSS tersebut sesuai dengan keinginan.
Perhatikan Langkah 10, ubah nama "Artikel Terkait" sesuai keinginan dan ubah nilai 5 untuk menentukan jumlah artikel terkait yang akan ditampilkan, jika diset nilai maka hanya akan muncul 5 artikel dari setiap kategori.

Tampilan secara keseluruhan dari semua langkah diatas:

Mudah-mudahan berhasil... Happy blogging :) Tinggalkan pesan dikomentar jika mengalami kegagalan...

Copassite

New Tutorial

Sponsor Of This Blog

Advertise

Senin, 25 Juli 2011

TUTORIAL Membuat Situs Jejaring Sosial
0

Jumat, 22 Juli 2011

Membuat Widget Lintas Berita di Blog
0

Cara Membuat Artikel Terkait
0

Cara Membuat Postingan Tampil Hanya Judulnya Saja
0

Membuat Artikel Terkait
0

Integrasi Artikel Terkait (Versi 1.0)

Poll

New Tutorial

Site Info

Total Pembaca Setia Blog Ini

Chat Area

Reader Community

Label

Copassite

New Tutorial

Sponsor Of This Blog

Advertise

Senin, 25 Juli 2011

TUTORIAL Membuat Situs Jejaring Sosial0

Jumat, 22 Juli 2011

Membuat Widget Lintas Berita di Blog0

Cara Membuat Artikel Terkait0

Cara Membuat Postingan Tampil Hanya Judulnya Saja0

Membuat Artikel Terkait0

Integrasi Artikel Terkait (Versi 1.0)

Poll

New Tutorial

Site Info

Total Pembaca Setia Blog Ini

Chat Area

Reader Community

Label

TUTORIAL Membuat Situs Jejaring Sosial
0

Membuat Widget Lintas Berita di Blog
0

Cara Membuat Artikel Terkait
0

Cara Membuat Postingan Tampil Hanya Judulnya Saja
0

Membuat Artikel Terkait
0