Trong bài này sẽ hướng dẫn các bạn từng bươc để Tự thiết kế template (giao diện) cho blospot của bạn:
.jpg)
Để có thể tự thiết kế template cho blogspot bạn cần trang bị cho mình những kiến thức sau:
Kiến thức cơ bản về HtmlĐây là một số điều kiện tối thiểu để bạn có thể tự thiết kế một template cho blogspot của riêng bạn, nhưng cũng không phải nhất thiết như vậy bạn có thể vừa làm vừa tìm hiểu.
Kiến thức cơ bản về CSS, Javascript, jquery, photoshop,...
Và một số công cụ phát triển triển website như Dreamwever, editplus,..
I Tìm hiểu về cấu trúc cơ bản của website và blog
- Cấu trúc cơ bản của một website cho dù được lập trình bằng bất kỳ ngôn ngữ nào (PHP, ASP,...) thì cũng đều được biên dịch về ngông ngữ Html, và gồm những phần cơ bản sau:
<!Doctype>: Phần khai báo chuẩn của html hay xhtml.// Bạn tham khảo thêm chuẩn html
<html>
<head> // đây là phần khai báo ban đầu gòm
<style type='text/css'>// các bạn tìm hiểu thêm để biết CSS là gìKhai báo CSS
..............................
</style>
<meta>
thẻ này dùng để mô tả website của bạn
tim hiểu thêm để biết cách sử dung thẻ
...............................
</meta>
<title>
Tiêu đề của website
</title>
</head>
<body>
Phần chứa nội dung của website
</body>
</html>
2. Cấu trúc của Blog cơ bản cũng giống như cấu trúc của website và gồm những phần sau:
<?xml version="1.0" encoding="UTF-8" ?>
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b'xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<meta>
...................................
</meta>
<title>//Tiêu đề của website</title>
<b:skin><![CDATA[ //thẻ này thay cho thẻ <style type='text/css'></style>
//Tất cả các thuộc tính CSS của bạn được khai báo ở đây
]]></b:skin>
</head>
<body>
//phần nội dung của blog
</body>
</html>
II Thiết kế template cho blogspot: Trong phần này chúng ta sẽ đi vào các bước cụ thể để thiết kế một template (giao diện) cho blog spot:
Đầu tiên bạn đăng nhập vào phần quản trị blog => mục edit html xóa hết code bên trong
Copy đoạn mã bên dưới sau đó lưu lại
<?xml version="1.0" encoding="UTF-8" ?>
<html xmlns='http://www.w3.org/1999/xhtml'
xmlns:b='http://www.google.com/2005/gml/b'
xmlns:data='http://www.google.com/2005/gml/data'
xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:skin><![CDATA[
]]></b:skin>
</head>
<body>
<b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'>
<b:widget id='Navbar1' locked='true' title='Thanh điều hướng' type='Navbar'/>
</b:section>
</body>
</html>
0 nhận xét:
Đăng nhận xét