Buat Page Log In di Dreamweaver CS3

Banyak para pengguna Dreamweaver CS3 belum banyak tahu bagaimana caranya membuat sebuah halaman untuk Log In. Dalam tutorial kali ini, Anda akan belajar membuat sebuah halaman untuk log in.

Sebelum masuk ke dalam tutorial ini, saya asumsikan Anda telah memiliki memiliki tabel data MySQL yang menyimpan data username dan password yang akan digunakan untuk log in dan Anda telah membuat Database Connection.

Berikut ini adalah contoh form yang akan digunakan.

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Untitled Document</title>
</head>
<body>
<form id=”form1″ name=”form1″ method=”post” action=”">
<p><label>Username:<input type=”text” name=”username” id=”username” /></label> </p>
<p><label>Password: <input type=”text” name=”password” id=”password” /></label></p>
<p><input type=”submit” name=”submit” id=”submit” value=”Log In” /></p>
</form>
</body>
</html>


Maka tampilannya akan tampak seperti gambar di bawah ini:

Menambahkan fasilitas Log In user

Setelah form di atas telah jadi, berikut adalah langkah selanjutnya:
  1. Klik Server Behaviors > User Authentication > Log In User
  2. Window Log In User akan keluar, isikan beberapa parameter berikut ini.
  3. Get input from form: form1
  4. Username field: username
  5. Password field: password
  6. Validate using connection: ……………..pilih koneksi yang telah Anda buat
  7. Table: administrator (bisa jadi nama tabelnya berbeda. Dalam tutorial ini diasumsikan fasilitas log in menggunakan data username dan password yang disimpan dalam tabel administrator).
  8. Username column: username
  9. Password column: password
  10. If log in succeds, go to: index.php, link ini harus diisi untuk mengarahkan user ke halaman yang telah Anda tentukan setelah melakukan Log In
  11. Go to previous URL (If exist), ini dapat Anda beri tanda check. Maksud dari ini adalah jika Anda mencoba memasukki halaman yang diproteksi, maka biasanya Anda akan diarahkan ke ke halaman log in. Begitu Anda melakukan log in, maka Anda otomatis akan diredirect ke halaman terproteksi tersebut
  12. If log in fails, go to: login.php, ini artinya jika seseorang mengalami kegagalan log in mau diarahkan ke halaman mana.
  13. Restrict access based on: Username and password. Jika Anda memilih Username, password and access level, pastikan tabel Administrator juga menyediakan kolom level administrator.
  14. Klik OK
  15. Dreamweaver otomatis akan menambahkkan scripts Log In User di atas kode HTML yang sebelumnya Anda buat.
Berikut adalah kode akhirnya:

<?php require_once(‘Connections/llll.php’); ?>
<?php
if (!function_exists(“GetSQLValueString”)) {
function GetSQLValueString($theValue, $theType, $theDefinedValue = “”, $theNotDefinedValue = “”)
{
if (PHP_VERSION < 6) {
$theValue = get_magic_quotes_gpc() ? stripslashes($theValue) : $theValue;
}


$theValue = function_exists(“mysql_real_escape_string”) ? mysql_real_escape_string($theValue) : mysql_escape_string($theValue);

switch ($theType) {
case “text”:
$theValue = ($theValue != “”) ? “‘” . $theValue . “‘” : “NULL”;
break;
case “long”:
case “int”:
$theValue = ($theValue != “”) ? intval($theValue) : “NULL”;
break;
case “double”:
$theValue = ($theValue != “”) ? doubleval($theValue) : “NULL”;
break;
case “date”:
$theValue = ($theValue != “”) ? “‘” . $theValue . “‘” : “NULL”;
break;
case “defined”:
$theValue = ($theValue != “”) ? $theDefinedValue : $theNotDefinedValue;
break;
}
return $theValue;
}
}
?>
<?php
// *** Validate request to login to this site.
if (!isset($_SESSION)) {
session_start();
}

$loginFormAction = $_SERVER['PHP_SELF'];
if (isset($_GET['accesscheck'])) {
$_SESSION['PrevUrl'] = $_GET['accesscheck'];
}

if (isset($_POST['username'])) {
$loginUsername=$_POST['username'];
$password=$_POST['password'];
$MM_fldUserAuthorization = “”;
$MM_redirectLoginSuccess = “index.php”;
$MM_redirectLoginFailed = “login.php”;
$MM_redirecttoReferrer = true;
mysql_select_db($database_llll, $llll);

$LoginRS__query=sprintf(“SELECT username, password FROM administrator WHERE username=%s AND password=%s”,
GetSQLValueString($loginUsername, “text”), GetSQLValueString($password, “text”));

$LoginRS = mysql_query($LoginRS__query, $llll) or die(mysql_error());
$loginFoundUser = mysql_num_rows($LoginRS);
if ($loginFoundUser) {
$loginStrGroup = “”;

if (PHP_VERSION >= 5.1) {session_regenerate_id(true);} else {session_regenerate_id();}
//declare two session variables and assign them
$_SESSION['MM_Username'] = $loginUsername;
$_SESSION['MM_UserGroup'] = $loginStrGroup;

if (isset($_SESSION['PrevUrl']) && true) {
$MM_redirectLoginSuccess = $_SESSION['PrevUrl'];
}
header(“Location: ” . $MM_redirectLoginSuccess );
}
else {
header(“Location: “. $MM_redirectLoginFailed );
}
}
?>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Untitled Document</title>
</head>

<body>
<form id=”form1″ name=”form1″ method=”POST” action=”<?php echo $loginFormAction; ?>”>
<p><label>Username:<input type=”text” name=”username” id=”username” /></label> </p>
<p><label>Password: <input type=”text” name=”password” id=”password” /></label></p>
<p><input type=”submit” name=”submit” id=”submit” value=”Log In” /></p>
</form>
</body>
</html>



Java Web Media adalah perusahaan yang bergerak di bidang web desain dan web development. Java Web Media berkantor di kota Depok. Kami siap membantu Anda mewujudkan website Anda.

Cara Memasang Page Number Navigation Bar Pada Blog



Kali ini saya akan tunjukkan tutorial cara memasang Page Number Navigation bar pada blog untuk memudahkan pelawat membuka halaman lain pada blog yang dilawati tersebut. Ikut langkah-langkah di bawah dengan betul. Jika ada masalah sila kongsi di bahagian comment.


Langkah 1

1. Seperti biasa masuk ke Dashboard > Layout > Edit html.

2. Buat backup pada template untuk langkah keselamatan.

3. Tekan Ctrl + F dan cari code di
bawah:

]]></b:skin>

4. Paste code di bawah sebelum code ]]></b:skin>

.showpageArea {padding: 0 2px;margin-bottom:10px;margin-top:10px;}

.showpageArea a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
 text-decoration: none;}
.showpageArea a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
 background-color: #FFFFFF;}

.showpageNum a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
 text-decoration: none;}
.showpageNum a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
 background-color: #FFFFFF;}
.showpagePoint {font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #333;
color: #fff;
 background-color: #000000;}

.showpage a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
 background-color: #FFFFFF;}
.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #0066cc;
color: #0066cc;
background-color: #FFFFFF;}

.showpageNum a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
 background-color: #FFFFFF;}


Langkah 2

1. Cari code di bawah:

<b:section class=’main’ id=’main’ showaddelement=’yes’>
<b:widget id=’Blog1′ locked=’true’ title=’Blog Posts’ type=’Blog’/>
</b:section>


2. Selepas </b:section> paste code di bawah:

<script type='text/javascript'>
 var home_page_url = location.href;
var pageCount=6;
var displayPageNum=10;
var upPageWord ='Previous';
var downPageWord ='Next';

function showpageCountundefinedjson) {
var thisUrl = home_page_url;
var htmlMap = new Arrayundefined);
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

forundefinedvar i=0, post; post = json.feed.entry[i]; i++) {

var timestamp1 = post.published.$t.substringundefined0,19)+post.published.$t.substringundefined23,29);
timestamp = encodeURIComponentundefinedtimestamp1);

var title = post.title.$t;

ifundefinedtitle!=''){
ifundefineditemCount==0 || undefineditemCount % pageCount ==undefinedpageCount-1))){
ifundefinedthisUrl.indexOfundefinedtimestamp)!=-1 ){
  thisNum = postNum;}
ifundefinedtitle!='') postNum++;
  htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'&amp;max-results='+pageCount;}}
  itemCount++;}

forundefinedvar p =0;p&lt; htmlMap.length;p++){
ifundefinedp&gt;=undefinedthisNum-displayPageNum-1) &amp;&amp; p&lt;undefinedthisNum+displayPageNum)){
ifundefinedfFlag ==0 &amp;&amp; p == thisNum-2){
ifundefinedthisNum==2){
upPageHtml = '&lt;span class=&quot;showpage&quot;&gt;&lt;a href=&quot;/&quot;&gt;'+ upPageWord +'&lt;/a&gt;&lt;/span&gt;';
}else{
  upPageHtml = '&lt;span class=&quot;showpage&quot;&gt;&lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;'+ upPageWord +'&lt;/a&gt;&lt;/span&gt;';}

  fFlag++;}

ifundefinedp==undefinedthisNum-1)){
html += '&lt;span class=&quot;showpagePoint&quot;&gt;'+thisNum+'&lt;/span&gt;';
}else{
ifundefinedp==0){
html += '&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;/&quot;&gt;1&lt;/a&gt;&lt;/span&gt;';

}else{
  html += '&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;'+ undefinedp+1) +'&lt;/a&gt;&lt;/span&gt;';}}

ifundefinedeFlag ==0 &amp;&amp; p == thisNum){
downPageHtml = '&lt;span class=&quot;showpage&quot;&gt; &lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;'+ downPageWord +'&lt;/a&gt;&lt;/span&gt;';
  eFlag++;}}}

ifundefinedthisNum&gt;1){
  html = ''+upPageHtml+' '+html +' ';}

html = '&lt;div class=&quot;showpageArea&quot;&gt;&lt;span style=&quot;COLOR: #000;&quot; class=&quot;showpageOf&quot;&gt; Pages undefined'+undefinedpostNum-1)+')&lt;/span&gt;'+html;

ifundefinedthisNum&lt;undefinedpostNum-1)){
  html += downPageHtml;}

ifundefinedpostNum==1) postNum++;
html += '&lt;/div&gt;';

var pageArea = document.getElementsByNameundefined&quot;pageArea&quot;);
var blogPager = document.getElementByIdundefined&quot;blog-pager&quot;);

ifundefinedpostNum &lt;= 2){
  html ='';}

forundefinedvar p =0;p&lt; pageArea.length;p++){
  pageArea[p].innerHTML = html;}

ifundefinedpageArea&amp;&amp;pageArea.length&gt;0){
  html ='';}

ifundefinedblogPager){
  blogPager.innerHTML = html;}
}

function showpageCount2undefinedjson) {

var thisUrl = home_page_url;
var htmlMap = new Arrayundefined);
var isLablePage = thisUrl.indexOfundefined&quot;/search/label/&quot;)!=-1;
var thisLable = isLablePage ? thisUrl.substrundefinedthisUrl.indexOfundefined&quot;/search/label/&quot;)+14,thisUrl.length) : &quot;&quot;;
thisLable = thisLable.indexOfundefined&quot;?&quot;)!=-1 ? thisLable.substrundefined0,thisLable.indexOfundefined&quot;?&quot;)) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

var labelHtml = '&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;/search/label/'+thisLable+'?&amp;max-results='+pageCount+'&quot;&gt;';
var thisUrl = home_page_url;

forundefinedvar i=0, post; post = json.feed.entry[i]; i++) {

var timestamp1 = post.published.$t.substringundefined0,19)+post.published.$t.substringundefined23,29);
timestamp = encodeURIComponentundefinedtimestamp1);

var title = post.title.$t;

ifundefinedtitle!=''){
ifundefineditemCount==0 || undefineditemCount % pageCount ==undefinedpageCount-1))){
ifundefinedthisUrl.indexOfundefinedtimestamp)!=-1 ){
  thisNum = postNum;}

ifundefinedtitle!='') postNum++;
  htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'&amp;max-results='+pageCount;}}
  itemCount++;}

forundefinedvar p =0;p&lt; htmlMap.length;p++){
ifundefinedp&gt;=undefinedthisNum-displayPageNum-1) &amp;&amp; p&lt;undefinedthisNum+displayPageNum)){
ifundefinedfFlag ==0 &amp;&amp; p == thisNum-2){
ifundefinedthisNum==2){
upPageHtml = labelHtml + upPageWord +'&lt;/a&gt;&lt;/span&gt;';
}else{
  upPageHtml = '&lt;span class=&quot;showpage&quot;&gt;&lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;'+ upPageWord +'&lt;/a&gt;&lt;/span&gt;';}

  fFlag++;}

ifundefinedp==undefinedthisNum-1)){
html += '&lt;span class=&quot;showpagePoint&quot;&gt;'+thisNum+'&lt;/span&gt;';
}else{
ifundefinedp==0){
html = labelHtml+'1&lt;/a&gt;&lt;/span&gt;';
}else{
  html += '&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;'+ undefinedp+1) +'&lt;/a&gt;&lt;/span&gt;';}}

ifundefinedeFlag ==0 &amp;&amp; p == thisNum){
downPageHtml = '&lt;span class=&quot;showpage&quot;&gt; &lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;'+ downPageWord +'&lt;/a&gt;&lt;/span&gt;';
  eFlag++;}}}

ifundefinedthisNum&gt;1){
ifundefined!isLablePage){
html = ''+upPageHtml+' '+html +' ';
}else{
  html = ''+upPageHtml+' '+html +' ';}}

html = '&lt;div class=&quot;showpageArea&quot;&gt;&lt;span style=&quot;COLOR: #000;&quot; class=&quot;showpageOf&quot;&gt; Pages undefined'+undefinedpostNum-1)+')&lt;/span&gt;'+html;

ifundefinedthisNum&lt;undefinedpostNum-1)){
  html += downPageHtml;}

ifundefinedpostNum==1) postNum++;
html += '&lt;/div&gt;';

var pageArea = document.getElementsByNameundefined&quot;pageArea&quot;);
var blogPager = document.getElementByIdundefined&quot;blog-pager&quot;);

ifundefinedpostNum &lt;= 2){
  html ='';}

forundefinedvar p =0;p&lt; pageArea.length;p++){
  pageArea[p].innerHTML = html;}

ifundefinedpageArea&amp;&amp;pageArea.length&gt;0){
  html ='';}

ifundefinedblogPager){
  blogPager.innerHTML = html;}}

 </script>
<script type='text/javascript'>

var thisUrl = home_page_url;
if undefinedthisUrl.indexOfundefined&quot;/search/label/&quot;)!=-1){
if undefinedthisUrl.indexOfundefined&quot;?updated-max&quot;)!=-1){
var lblname1 = thisUrl.substringundefinedthisUrl.indexOfundefined&quot;/search/label/&quot;)+14,thisUrl.indexOfundefined&quot;?updated-max&quot;));
}else{
  var lblname1 = thisUrl.substringundefinedthisUrl.indexOfundefined&quot;/search/label/&quot;)+14,thisUrl.indexOfundefined&quot;?&amp;max&quot;));}}

var home_page = &quot;/&quot;;
if undefinedthisUrl.indexOfundefined&quot;?q=&quot;)==-1 &amp;&amp; thisUrl.indexOfundefined&quot;.html&quot;)==-1){
if undefinedthisUrl.indexOfundefined&quot;/search/label/&quot;)==-1){
document.writeundefined'&lt;script src=&quot;'+home_page+'feeds/posts/summary?alt=json-in-script&amp;callback=showpageCount&amp;max-results=99999&quot; &gt;&lt;\/script&gt;')
  }else{document.writeundefined'&lt;script src=&quot;'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&amp;callback=showpageCount2&amp;max-results=99999&quot; &gt;&lt;\/script&gt;')}}
</script>


4. Klik Save Template.

Untuk customize:

Anda boleh tukar code berwarna di bawah:

var pageCount=6; - Nombor 6 untuk show berapa banyak post per page. Setting ini mesti sama dengan setting pada Dashboard > Setting > Formatting > Show > 6 posts
var displayPageNum=10; - Nombor 10 untuk show berapa page pada navigation bar.
var upPageWord ='Previous'; - Anda boleh tukar Previous dengan Sebelum atau sebagainya.
var downPageWord ='Next'; - Anda boleh tukar Next dengan Selepas atau sebagainya.

Senarai Website Menyediakan Template Blog

Kepada anda yang baru berbloging dan masih tercari-cari template yang sesuai untuk blog anda, anda tak perlu lagi search di google kerana saya telah pun sediakan senarai website yang menyediakan template blog untuk anda download. Anda boleh pilih template ikut kesesuaian blog dan citarasa anda. Saya pun guna template ringkas je. Janji ada informasi berguna untuk anda baca. :-)

Antara senarai web yang menyediakan template blog:

http://blogger-templates.blogspot.com
http://blogskins.com
http://blogtemplate4u.com

http://btemplates.com

http://finalsense.com/services/blog_templates

http://free-blogger-template-layout.blogspot.com
http://freeblogtemplatess.blogspot.com
http://freetemplates.blogspot.com
http://garcya.us/blog/free-templates
http://templatesparanovoblogger.blogspot.com
http://the-blogger-templates.com
http://themes.BlogFlux.com
http://www.allblogtools.com/category/blogger-templates
http://www.bloganol.com 
http://www.blogcrowds.com
http://www.blogfashions.com
http://www.eblogtemplates.com
http://www.flashmo.com
http://www.idwebtemplate.com
http://www.isnaini.com/blogger-templates
http://www.ourblogtemplates.com 
http://www.problogger.net/archives/2006/05/31
http://www.pyzam.com/bloggertemplates
http://www.themza.com/moodle
http://www.webdesignmo.com/blog
www.blogcrowds.com/resources/blogger_template.php
www.BloggerBlogTemplates.blogspot.com
www.bloggerbuster.com
www.Blogger-Templates.blogspot.com
www.jackbook.com/category/blogger-templates-gallery

Kalau tak cukup jugak mintak la lagi kat pak cik google k..:-D

Hilangkan Angka Pada Kategori Blog


Kepada blogger yang menulis blog mengikut kategori contohnya personal, tutorial dan sebagainya pada sebelah kategori tersebut ada jumlah post yang anda kategorikan. Lebih mudah anda post bawah kategori tutorial ada 3 post iaitu cara diet, cara buat kek dan cara berhenti merokok contohnya akan muncul angka 3 di sebelah tutorial. Jika anda tak nak angka tersebut muncul pada bahagian kategori anda
boleh hilangkannya. Tengok contoh gambar di atas.

Caranya amat mudah sekali.

Pertama sekali seperti biasa masuk ke Dashboard > Layout > Edit HTML dan buat backup dulu pada template.

Kemudian tick pada Expand Template Widget.

Klik Ctrl+F dan cari kod di bawah dan delete.

<span dir='ltr'>(<data:label.count/>)</span>

Selesai.

Senang kan?
 
By Fara C Kechix Design, Copyright 2012.