Menambahkan Site Info Panel Pada PHP-Fusion 6.xx

PHP-Fusion merupakan salah satu cms yang cukup banyak digunakan pada saat ini. Dengan menggunakan cms ini kita dapat dengan mudah membuat sebuah website tanpa harus mengerti bahasa pemrograman tertentu. Disini saya akan menjelaskan bagaimana menambahkan site info panel pada php-fusion 6.xx.

Panel ini merupakan panel pertama yang saya buat pada saat saya memperlajari membuat website dengan menggunakan cms php-fusion. Dengan menggunakan panel ini website kita yang dibuat dengan menggunakan cms php-fusion akan dapat menampilkan informasi tertentu pada website kita. Informasi tersebut diantaranya IP pengunjung, Proxy pengunjung, dan juga browser yang digunakan oleh pengunjung situs, serta informasi yang lainnya.

Berikut ini merupakan tampilan panel apabila telah berhasil ditambahkan pada situs php-fusion anda :

Berikut ini cara menambahkannya pada website php-fusion anda :
1. Downloadlah filenya dengan mengklik link ini.
2. Uploadlah file tersebut ke folder infusions tentunya setelah anda ekstrak terlebih dahulu filenya.
3. Loginlah kesitus anda sebagai admin
4. Dari halaman admin panel pilihlah System Admin kemudian pilih Panel
5. Klik menu Add New Panel
6. Isi panel namenya dengan nama Site Info Panel kemudian pada Panel Filename pilihlah site_info_panel, untuk panel side anda bisa menggunakan Left ataupun Right kemudian aksesnya pilihlah public agar pengunjung dapat melihat panel tersebut setelah itu klik save panel. (Untuk Panel Content biarkan saja isinya tidak usah dirubah)
7. Kembali kehalaman utama website anda dan anda akan mendapatkan hasilnya pada sisi kiri/kanan website anda.

READ MORE - Menambahkan Site Info Panel Pada PHP-Fusion 6.xx

SEO Weblinks dan Weblink Categories Pada PHP-Fusion

SEO Weblinks dan Weblink Categories merupakan modifikasi SEO yang dilakukan agar situs yang dibuat dengan menggunakan CMS php-fusion menjadi lebih mudah diindex oleh search engine.
Sebelumnya saya pernah memposting mengenai SEO URL Optimization dan SEO Tags Mod yang merupakan kelanjutan seri modifikasi SEO untuk php-fusion.

Berikut ini langkah-langkah modifikasinya :
1. Downloadlah file seoname.php berikut ini terlebih dahulu. Klik Disini. Lalu uploadlah file tersebut ke folder include php-fusion anda. Jika anda sudah memilikinya lanjutkan ke langkah berikutnya (^^,)
2. Backuplah file maincore.php yang berada di root folder php-fusion anda terlebih dahulu sebelum melakukan perubahan.
3. Bukalah file maincore.php lalu carilah kode berikut :

?>

tambahkan kode berikut ini sebelum kode yang ada diatas :

// Search engine friendly URLs
// http://gnoubdils.blogspot.com/
require_once INCLUDES."seoname.php";

simpan perubahan pada file maincore.php
4. Buatlah file .htaccess diroot folder php-fusion anda dan masukan kode berikut ini, jika anda sudah mempunyai file tersebut tambahkan saja kode berikut ini :

## Use this if Fusion is installed in your root directory
RewriteBase /
## Use the following if Fusion is not installed on your root directory
## RewriteBase //
RewriteEngine On
## Weblinks
RewriteRule ^(.*)-w([0-9]*).html$ weblinks.php?weblink_id=$2 [L,NC]
## Weblinks categories
RewriteRule ^(.*)-wc([0-9]*).html$ weblinks.php?cat_id=$2 [L,NC]

kalau anda sudah pernah membuatnya cukup tambahkan kode yang berwarna biru.
5. Buka file weblinks.php dan carilah kode berikut ini (jangan lupa dibackup terlebih dahulu) :

<a   href='".FUSION_SELF."?cat_id=".$data['weblink_cat_id']."'>

kemudian rubahlah dengan kode berikut ini :

<a   href='".seoname($data['weblink_cat_name'])."-wc".$data['weblink_cat_id'].".html'>

cari juga kode berikut ini :

<a   href='".FUSION_SELF."?cat_id=$cat_id&weblink_id=".$data['weblink_id']."'   target='_blank'>

rubahlah dengan kode berikut ini :

<a   href='".BASEDIR.seoname($data['weblink_name'])."-w".$data['weblink_id'].".html'   target='_blank'>

simpan dan pastikan web anda telah berubah dan berjalan dengan semestinya

READ MORE - SEO Weblinks dan Weblink Categories Pada PHP-Fusion

SEO URL Optimization Pada PHP-Fusion

SEO URL Optimization pada php-fusion merupakan sebuah modifikasi SEO yang dilakukan untuk mengoptimasi website yang dibuat dengan cms php-fusion agar lebih mudah diindex oleh search engine. Dimana link yang semula berbentuk /articles.php?cat_id=1 pada addressbar akan berubah menjadi static seperti /article-title-a1.html. Sebagai catatan perubahan ini dapat dilakukan untuk website yang berjalan pada server yang menggunakan Apache Web Server.

Berikut ini merupakan langkah-langkah untuk mengoptimasi URL pada website php-fusion anda :
1. downloadlah file berikut ini klik disini
2. sebelum melakukan modifikasi backup terlebih dahulu file maincore.php
3. upload file seoname.php yang sebelumnya telah anda download dan ekstrak dari file yang anda download kedalam folder include
4. buka file maincore.php yang ada diroot direktori php-fusion dan cari kode berikut ini :

?>

tambahkan kode berikut ini dibawahnya :

// Search engine friendly URLs
// http://gnoubdils.blogspot.com/
require_once INCLUDES."seoname.php";

simpan file maincore.php
5. buatlah file .htaccess dan masukan kode berikut ini, jikalau file tersebut sudah ada maka tinggal tambahkan saja kode berikut ini :

  ## Use this if Fusion is installed in your root directory
  RewriteBase /
  ## Use the following if Fusion is not installed on your root directory
  ## RewriteBase //
  RewriteEngine On
  ## Articles
  RewriteRule ^(.*)-r([0-9]*).html$ readarticle.php?article_id=$2 [L,NC]
  ## Article categories

  RewriteRule ^(.*)-c([0-9]*).html$ articles.php?cat_id=$2 [L,NC]

upload file .htaccess ke direktori root php-fusion.
6. buka file artikel.php kemudian carilah kode berikut ini :

<a href='".FUSION_SELF."?cat_id=".$data['article_cat_id']."'>

 kemudian rubahlah dengan kode berikut ini :

<a href='".seoname($data['article_cat_name'])."-c".$data['article_cat_id'].".html'>

carilah kode berikut ini :

<a href='readarticle.php?article_id=".$data['article_id']."'>

rubahlah dengan kode berikut ini :

<a href='".seoname($data['article_subject'])."-r".$data['article_id'].".html'>

simpan dan pastikanlah website anda telah berubah dan berjalan dengan semestinya..

READ MORE - SEO URL Optimization Pada PHP-Fusion

SEO Tags Mod Pada PHP-Fusion

SEO Tags Mod merupakan sebuah modifikasi code yang dibuat untuk php-fusion 6.xx dimana ini merupakan salah satu modifikasi SEO agar situs yang dibuat dengan CMS php-fusion dapat lebih mudah diindex oleh mesin pencari.

Sebelum anda melakukan perubahan title pada website anda akan tampil seperti GnouBdilS - Personal Portal begitu pula dengan meta keyword dan description akan tampil sama disetiap halaman. Namun setelah dilakukan perubahan akan berubah menjadi Judul Posting - GnouBdilS - Personal Portal. dan meta keyword serta descriptionnya juga akan berubah.

Ada 2 cara untuk melakukan modifikasi SEO pada php-fusion versi 6.xx tapi terlebih dahulu lakukan backup pada file web anda dan downloadlah file berikut ini.
Berikut ini langkah-langkah melakukan perubahannya :

1. Cara pertama :
- uploadlah file seo_tags_include.php yang telah anda download pada folder include php-fusion anda
- uploadlah file subheader.php yang baru yang disertakan pada file yang telah anda download dan overwrite file subheader.php yang lama yang ada di root folder php-fusion anda
- periksa situs anda dan pastikan semua perubahan berhasil dan website anda berjalan dengan semestinya

2. Cara kedua merupakan cara manual berikut langkahnya :
- uploadlah file seo_tags_include.php yang telah anda download pada folder include php-fusion
- buka file subheader.php yang ada di root folder php-fusion dan carilah kode berikut ini :

if ($settings['maintenance'] == "1"   && !iADMIN) fallback(BASEDIR."maintenance.php");

if (iMEMBER) $result = dbquery("UPDATE ".$db_prefix."users SET   user_lastvisit='".time()."', user_ip='".USER_IP."' WHERE   user_id='".$userdata['user_id']."'");

 tambahlah kode berikut ini dibawahnya :

// SEO tags mod
require_once INCLUDES."seo_tags_include.php";
$seo_tags =   seo_tags($article_id,$cat_id,$readmore,$forum_id,$thread_id,$db_prefix,$page_id);
// END SEO tags mod<

 cari juga kode berikut ini :

<title>".$settings['sitename']."</title>
<meta http-equiv='Content-Type' content='text/html; charset=".$locale['charset']."'>
<meta name='description' content='".$settings['description']."'>
<meta name='keywords' content='".$settings['keywords']."'>

 ubahlah dengan kode berikut ini :

<!-- SEO tags mod -->
  <title>".$seo_tags['title'].$settings['sitename']."</title>
  <meta http-equiv='Content-Type' content='text/html; charset=".$locale['charset']."'>
  <meta name='description' content='";

if ($seo_tags['description']) {
  echo $seo_tags['description'];
  } else {
  echo $settings['description'];
  }

echo "'>
  <meta name='keywords' content='";

if ($seo_tags['keywords']) {
  echo $seo_tags['keywords'];
  } else {
  echo $settings['keywords'];
  }

echo "'>
  <!-- END SEO tags mod -->

- simpan file subheader.php kemudian lihatlah website anda pastikan semua telah berjalan dengan semestinya

READ MORE - SEO Tags Mod Pada PHP-Fusion

Membagi Posting Blogger di Twitter

Untuk meningkatkan trafik dan rank blog kita bisa dengan banyak cara salah satunya adalah dengan berbagi posting blog kita di twitter. Ada berbagai cara untuk membagikan posting blog kita melalui twitter namun salah satu cara yang paling mudah adalah dengan memasang button dari Tweetmeme dan Retweet.

1. Memasang button Tweetmeme
adapun button Tweetmeme yang dimaksud adalah seperti berikut ini :

berikut ini langkah untuk dapat memasang buton tersebut di blog kita:
- Masuklah kehalaman Layout lalu pilih Edit HTML kemudian carilah kode berikut ini :

<div class='post-header-line-1'/>

- kemudian letakkan kode berikut ini tepat dibawah kode tersebut:

<div style='float:right; margin-left:10px;'>

<script type='text/javascript'>

tweetmeme_url = &#39;<data:post.url/>&#39;

</script>

<script src='http://tweetmeme.com/i/scripts/button.js'   type='text/javascript'>   </script>

</div>

2. Memasang button Retweet
button retweet yang dimaksud adalah button seperti dibawah ini :

hampir sama dengan button Tweetmeme cara memasang button Retweet pada blog kita melalui langkah-langkah berikut ini :
- Masuklah kehalaman Layout lalu pilih Edit HTML kemudian carilah kode berikut ini :

<div class='post-header-line-1'/>

-  kemudian letakkan kode berikut ini tepat dibawah kode tersebut:

<script type="text/javascript">

url = '<data:post.url>';

</script>

<script type="text/javascript"   src="http://www.retweet.com/static/retweets.js"></script>

 kalau anda menginginkan gambar yang berukuran kecil anda dapat menggunakan kode yang berikut ini:

<script type="text/javascript">

url = '<data:post.url>';

size = 'small';

</script>

<script type="text/javascript"   src="http://www.retweet.com/static/retweets.js"></script>

selamat mencoba...

READ MORE - Membagi Posting Blogger di Twitter

Membuat Widget Scrolling Pada Blogger

Widget Scrolling biasanya berfungsi sebagai penghemat ruang pada suatu  blog.
Contoh penggunaan Widget Scrolling ada pada blog ini pada bagian Go To Link.

Adapun langkah-langkah untuk membuat Widget Scrolling tersebut yaitu sebagai berikut:
- dari menu Layout pilihlah Page Elements kemudian tambahkanlah sebuah Widget baru pada bagian manapun di blog anda, pilihlah HTML/Javascript Widget lalu letakan kode dibawah ini didalamnya:

<center>
<div style="border: 1px solid rgb(151, 151, 151); overflow: auto; width: 182px; height: 200px; text-align: center;" >
</div></center>

kode <center> yang berfungsi sebagai perataan bisa diganti sesuai kebutuhan menjadi <left> atau <right>
Untuk nilai height/tinggi dan width/lebarnya pun juga bisa disesuaikan sesuai dengan kebutuhan.
- apabila anda ingin menambahkan isi kedalam widget tersebut maka cukup tambahkan kode diantara <div> dan </div> contoh :

<div style="border: 1px solid rgb(151,   151, 151); overflow: auto; width: 210px; height: 260px; text-align:   left;" >
&nbsp;&nbsp;&raquo;&nbsp;&nbsp;<a   href="http://www.a1vbcode.com/">A1VBCode</a>
<br />
&nbsp;&nbsp;&raquo;&nbsp;&nbsp;<a   href="http://deconstructioncode.blogspot.com/">Deconstruction   Code</a>
<br />
&nbsp;&nbsp;&raquo;&nbsp;&nbsp;<a   href="http://www.echo.or.id/">Echo</a>
<br />
&nbsp;&nbsp;&raquo;&nbsp;&nbsp;<a   href="http://garyabraham.blogspot.com/">Gary Abraham</a>
<br />
&nbsp;&nbsp;&raquo;&nbsp;&nbsp;<a   href="http://widgets.mahesajenar.com/">Mahesajenar Widget</a>
<br />
&nbsp;&nbsp;&raquo;&nbsp;&nbsp;<a   href="http://www.o-om.com/">OOM Blog</a>
<br />
&nbsp;&nbsp;&raquo;&nbsp;&nbsp;<a   href="http://www.planetsourcecode.com/">Planet Source Code</a>
<br />
&nbsp;&nbsp;&raquo;&nbsp;&nbsp;<a   href="http://razbieblog.blogspot.com/">Rahma Blog</a>
<br />
&nbsp;&nbsp;&raquo;&nbsp;&nbsp;<a   href="http://eljomblocommunity.blogspot.com/">Terren Jr</a>
<br />
&nbsp;&nbsp;&raquo;&nbsp;&nbsp;<a   href="http://www.vb-bego.com/">VB-Bego</a>
</div>

 simpan Widget dan lihatlah hasilnya sudah seperti yang ada pada blog ini bukan??

READ MORE - Membuat Widget Scrolling Pada Blogger

Membuat Readmore Pada Blogger

Readmore adalah pemenggalan kalimat yang ada dalam sebuah posting baik itu posting yang ada pada sebuah blog ataupun website yang juga merupakan penanda bahwa kalimat dalam sebuah posting tersebut masih memiliki kelanjutan. Selain itu readmore juga berguna untuk mempersingkat sebuah posting yang panjang sehingga dapat lebih memberikan ruang pada blog atau website.

Disini akan dituliskan langkah membuat fungsi readmore pada blog dalam 2 cara.
Namun sebelum melakukan perubahan saya sarankan anda untuk membackup terlebih dahulu template milik anda.

Cara pertama:
- bukalah template blog lalu pilih Edit HTML dari halaman tersebut berilah tanda ceklist pada Expand Widget Template
- carilah kode dibawah ini :

<div class='post-header-line-1'/> <div class='post-body'>

- kalo sudah ditemukan masukan kode berikut ini tepat dibawah kode tersebut :

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

<style>.fullpost{display:inline;}</style>

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

<b:else/>

<style>.fullpost{display:none;}</style>

 - carilah juga kode dibawah ini :

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

 - tambahkan kode berikut ini dibawah kode tersebut :

<a   expr:href='data:post.url'>Readmore »»</a>
</b:if>

Note : tulisan readmore tersebut bisa dirubah sesuai dengan keinginan masing-masing dan bukanlah suatu hal yang baku.

Nah nantinya kode tersebut akan terangkai seperti berikut ini :

  <div class='post-header-line-1'/>
  <div class='post-body'>
  <b:if cond='data:blog.pageType == "item"'>
  <style>.fullpost{display:inline;}</style>
  <p><data:post.body/></p>
  <b:else/>
  <style>.fullpost{display:none;}</style>
  <p><data:post.body/></p>
  <a   expr:href='data:post.url'>Readmore »»</a>
  </b:if>
  <div style='clear: both;'/>

simpanlah semua perubahan yang telah kita lakukan tadi
- Bukalah settings/pengaturan kemudian  pilih Format/Formatting carilah bagian Post Template lalu masukan kode berikut ini :

<div class="fullpost">

</div>

- Penggunaannya nanti seperti ini, bila anda ingin membuat sebuah posting pada blog maka letakkanlah kode

<div class="fullpost">

</div>

pada bagian posting yang ingin kita potong dengan readmore. contoh :

HyperText Markup Language (HTML) adalah sebuah bahasa markup yang digunakan untuk membuat sebuah halaman web dan menampilkan berbagai informasi di dalam sebuah browser Internet. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup Language), HTML  adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web.
<div class="fullpost">
HTML  saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). Versi terakhir dari HTML  adalah HTML 4.01, meskipun saat ini telah berkembang XHTML yang merupakan pengembangan dari HTML.</div>

selesai sudah cara pertama untuk membuat readmore pada blogger.

Berikutnya yaitu cara kedua untuk membuat readmore pada blogger dimana pada cara kedua ini selain terdapat penggunaan readmore ada juga penggunaan thumbnail dari posting bila didalam posting tersebut terdapat sebuah gambar, berikut langkah-langkahnya:
- dari halaman Edit HTML beri tanda ceklist pada Expand Widget Template masukan kode berikut ini tepat diatas </head> :

<script type='text/javascript'>
    var thumbnail_mode = "float" ;
      summary_noimg = 250;
      summary_img = 250;
      img_thumb_height = 120;
      img_thumb_width = 120;

  </script>



  <script type='text/javascript'>
  //<![CDATA[
  /******************************************
  Auto-readmore link script, version 2.0 (for blogspot)
 
  (C)2008 by Anhvo
 
  visit http://en.vietwebguide.com to get more cool hacks
  ********************************************/
  function removeHtmlTag(strx,chop){
  if(strx.indexOf("<")!=-1)
  {
  var s = strx.split("<");
  for(var i=0;i<s.length;i++){
  if(s[i].indexOf(">")!=-1){
  s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
  }
  }
  strx = s.join("");
  }
  chop = (chop < strx.length-1) ? chop : strx.length-2;
  while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1)   chop++;
  strx = strx.substring(0,chop-1);
  return strx+'...';
  }
 
  function createSummaryAndThumb(pID){
  var div = document.getElementById(pID);
  var imgtag = "";
  var img = div.getElementsByTagName("img");
  var summ = summary_noimg;
  if(img.length>=1) {
  imgtag = '<span style="float:left; padding:0px 10px 5px   0px;"><img   src="'+img[0].src+'" width="'+img_thumb_width+'px"   height="'+img_thumb_height+'px"/></span>';
  summ = summary_img;
  }
 
  var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ)   + '</div>';
  div.innerHTML = summary;
  }
  //]]>
  </script>

- carilah kode berikut ini :

<data:post.body/>

 ubahlah kode tersebut dengan kode berikut ini :

<b:if cond='data:blog.pageType != "item"'>

<div expr:id='"summary" +   data:post.id'><data:post.body/></div>

<script   type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>

<span class='rmlink' style='float:left'><a   expr:href='data:post.url'>READ MORE -   <data:post.title/></a></span>

</b:if>

<b:if cond='data:blog.pageType ==   &quot;item&quot;'><data:post.body/></b:if>

Keterangan :

* var thumbnail_mode = "float";  (float = letak thumbnail dikiri, atau jika tidak silahkan ganti dengan no-float)
* summary_noimg = 250; (banyaknya karakter yang akan ditampilkan di posting tanpa gambar / thumbnail)
* summary_img = 250; (banyaknya karakter yang akan ditampilkan di posting dengan gambar / thumbnail)
* img_thumb_height = 120; (tinggi Thumbnail dalam piksel)
* img_thumb_width = 120; (lebar Thumbnail dalam piksel)

- simpan dan lihat hasilnya...

Nah dari 2cara tersebut anda bisa memilih yang mana yang lebih mudah untuk diterapkan dan mana yang terbaik yang dapat anda gunakan..

READ MORE - Membuat Readmore Pada Blogger