Hai para codinger yang mudah-mudahan selalu diberi kesehatan oleh Allah selamat datang kembali di blogDewa Coding 21 :)
Untuk pertemuan kali ini admin akan membahas masih seputar dunia PHP yakni cara merubah tampilan tema dengan PHP. oke tidak perlu panjang lebar mari kita langsung ke tutorialnya. cekidot
1. Langkah pertama silahkan buat 3 buah file css, sebagai contoh : default.css, red.css, dan blue.css. fungsinya sebagai style tema yang akan kita buat. atau anda bisa memasukan script-script berikut kedalam 3 buah file css diatas.
- red.css
- blue.css
- Default.css
Dan untuk source codenya bisa kalian download Disini / Here
Terima kasih telah berkunjung di blog kami, Jangan lupa berkomentar :)
Untuk pertemuan kali ini admin akan membahas masih seputar dunia PHP yakni cara merubah tampilan tema dengan PHP. oke tidak perlu panjang lebar mari kita langsung ke tutorialnya. cekidot
1. Langkah pertama silahkan buat 3 buah file css, sebagai contoh : default.css, red.css, dan blue.css. fungsinya sebagai style tema yang akan kita buat. atau anda bisa memasukan script-script berikut kedalam 3 buah file css diatas.
- red.css
body {
background: #c1392b;
overflow-x: hidden;
margin: 0;
padding: 0;
font-family: 'Open sans', sans-serif;
}
.header {
padding: 6px 8px;
width: 100%;
text-align: center;
background: #fff;
}
.header h2 {
color: #c1392b;
font-family: 'Raleway', sans-serif;
font-weight: 300;
}
form {
margin: 100px auto;
width: 300px;
}
form select {
width: 300px;
padding: 6px 8px;
border: 2px solid #fff;
color: #c1392b;
}
- blue.css
body {
background: #3598dc;
overflow-x: hidden;
margin: 0;
padding: 0;
font-family: 'Open sans', sans-serif;
}
.header {
padding: 6px 8px;
width: 100%;
text-align: center;
background: #fff;
}
.header h2 {
color: #3598dc;
font-family: 'Raleway', sans-serif;
font-weight: 300;
}
form {
margin: 100px auto;
width: 300px;
}
form select {
width: 300px;
padding: 6px 8px;
border: 2px solid #fff;
color: #3598dc;
}
- Default.css
body {
overflow-x: hidden;
margin: 0;
padding: 0;
background: #f2f2f3;
font-family: 'Open sans', sans-serif;
}
.header {
padding: 6px 8px;
width: 100%;
text-align: center;
background: #fff;
}
.header h2 {
color: #333;
font-family: 'Raleway', sans-serif;
font-weight: 300;
}
form {
margin: 100px auto;
width: 300px;
}
form select {
width: 300px;
padding: 6px 8px;
border: 2px solid #fff;
}
2. Selanjutnya, buat halaman index.php untuk menyediakan pilihan tema sekaligus mengimplementasikannya. dan silahkan masukkan script berikut
<?php
session_start();
if (isset($_POST['tema'])) {
$_SESSION['css'] = $_POST['tema'];
}
// Syntax untuk men set tema aktif
if(isset($_SESSION['css'])) {
$tema = $_SESSION['css'];
} else {
$tema = 'default';
}
?>
<html>
<head>
<title>Theme Aplikasi - Dewa Coding 21</title>
<link href='https://fonts.googleapis.com/css?family=Open+Sans|Raleway' rel='stylesheet' type='text/css'>
<link rel='stylesheet' type='text/css' href='theme/<?php echo $tema; ?>.css' />
</head>
<body>
<div class='header'>
<h2>Dewa Coding 21</h2>
</div>
<form action='' method='POST'>
<select name='tema' onchange='this.form.submit();'>
<option><?php echo $_SESSION['css']; ?></option>
<option>== Pilih Tema ==</option>
<option value='default'>default</option>
<option value='blue'>blue</option>
<option value='red'>red</option>
</select>
</form>
</body>
</html>
Selesai sudah tutorial Cara merubah tampilan tema dengan PHP mudah bukan caranya + scriptnya juga tidak terlalu rumit.session_start();
if (isset($_POST['tema'])) {
$_SESSION['css'] = $_POST['tema'];
}
// Syntax untuk men set tema aktif
if(isset($_SESSION['css'])) {
$tema = $_SESSION['css'];
} else {
$tema = 'default';
}
?>
<html>
<head>
<title>Theme Aplikasi - Dewa Coding 21</title>
<link href='https://fonts.googleapis.com/css?family=Open+Sans|Raleway' rel='stylesheet' type='text/css'>
<link rel='stylesheet' type='text/css' href='theme/<?php echo $tema; ?>.css' />
</head>
<body>
<div class='header'>
<h2>Dewa Coding 21</h2>
</div>
<form action='' method='POST'>
<select name='tema' onchange='this.form.submit();'>
<option><?php echo $_SESSION['css']; ?></option>
<option>== Pilih Tema ==</option>
<option value='default'>default</option>
<option value='blue'>blue</option>
<option value='red'>red</option>
</select>
</form>
</body>
</html>
Dan untuk source codenya bisa kalian download Disini / Here
Terima kasih telah berkunjung di blog kami, Jangan lupa berkomentar :)
Cara merubah tampilan tema dengan PHP
4/
5
Oleh
Unknown
