Để tạo một Header Banner trong Thesis theme không phải là khó nhưng nếu không cẩn thận bạn sẽ gặp phải những lỗi rất khó sửa. Hôm nay tôi xin giới thiệu với các bạn một công cụ khá hay dùng để tạo Header Banner một cách nhanh chóng mà không sợ bị lỗi.
Bước 1: Upload banner
Upload file banner hình dùng làm header lên server bằng chương trình FTP. Nhớ ghi lại đường dẫn tuyệt đối của hình
VD: http://doublemule.com/wp-content/themes/thesis_151/custom/images/your-image-name.png
Bước 2: Dùng công cụ tự động tạo code CSS
Đường dẫn công cụ: http://www.doublemule.com/thesis-custom-css-code-robot/thesis-code-robot-clickable-banner-image.html
Dán đường dẫn hình và khai báo kích thước vào các ô tương ứng. Sau đó nhấp nút “Make My Banner Code” để tạo code.
Đoạn mã code Ví dụ được tạo ra giống như sau:
/*
MAKE A BACKUP OF YOUR CUSTOM.CSS FILE BEFORE USING THIS CODE!
Copy and paste the ouput below into your custom.css file.
Refresh your site to behold the power of the Mule Herd.
*/
/* DoubleMule Clickable Header v. 1.0 */
.custom #header
{
background: #ffffff;
padding-top: 0em;
padding-right: 0em;
padding-bottom: 0em;
padding-left: 0em;
border-top: 0em;
border-right: 0em;
border-bottom: 0em;
border-left: 0em;
margin-top: 0em;
margin-right: 0em;
margin-bottom: 0em;
margin-left: 0em;
}.custom #header #logo a
{
display:block;
width:900px;
height:150px;
background:url(http://doublemule.com/wp-content/themes/thesis_151/custom/images/your-image-name.png) center no-repeat;
color:#000000;
text-indent: -9999px;
padding-top: 0em;
padding-right: 0em;
padding-bottom: 0em;
padding-left: 0em;
border-top: 0em;
border-right: 0em;
border-bottom: 0em;
border-left: 0em;
margin-top: 0em;
margin-right: 0em;
margin-bottom: 0em;
margin-left: 0em;
}.custom #header #tagline
{
color:#000000;
text-indent: -9999px;
}
Bước 3: Chỉnh sửa file custom.css (Nếu bạn dùng Thesis theme thì chắc chắn bạn biết mở file custom.css ở đâu rồi nhỉ)
Copy đoạn mã code tạo được và dán vào trong file custom.css.
Lưu kết quả và refresh trình duyệt để xem kết quả! Thật là dễ dàng phải không nào! :wink:
Chúc bạn thành công
Mr. Giải Pháp Số








Misao
Oct 13. 2009
Hay quá. Thx bác GPS! Có cái này thì ai cũng làm được rồi.
Tinh
Oct 15. 2009
Cái này chẳng qua cũng là cách xác định độ rộng, cao cho banner, chứ banner thực sự vẫn phải do mình design bác ạ. Như vậy title e là dễ làm anh em hiểu nhầm
Thanks anyway
Mr. Giải Pháp Số
Oct 15. 2009
Đúng là Title có vấn đề, sorry bà con! =]
Fere
Feb 08. 2012
Hay là mình chuyển sang làm tổng hợp số $ kiếm được trong tuần rồi dtanoe cho 5 người comment đầu tiên nhỉ . Cái này tớ phải thử mới đc
nam
Oct 27. 2009
Co minhf hoi la sao theme thesis này toàn có độ rộng quá vậy nhỉ?màn hình phân giả 1024×768 mà vẫn phải kéo ngang…Có thể chỉnh nhỏ lại trong panel dc ko?và tại sao mặc định theme lại thế?Thanks
MrGiaiPhapSo
Oct 27. 2009
Bạn vào “Thesis Design Options”, trong mục “Site Layout” Bạn có thể tùy chỉnh layout và kích thước của nó. Bạn cộng tất cả kích thước vào mà 1024px=< thì nó sẽ hiển thị tốt trên độ phân giải màn hình 1024×768!
Chịu khó mò mẫm tiếp nhé!
nam
Oct 27. 2009
Thanks…Cachs tạp đường viền xung quanh sitebar,post homepage and single post sao Dũng nhir?
Tiện thể mình đưa ser 1.6b lên đây nhé:
http://www.mediafire.com/?jnzhyjjmgd3
nam
Oct 28. 2009
thesis 1.6 final: http://www.mediafire.com/?jnzhyjjmgd3
:woot: :woot: :woot:
MrGiaiPhapSo
Oct 28. 2009
À, mấy cái viền xung quanh là bác phải vào : Design Option -> Framework Option -> Bác chọn cái page framework thì nó mới bao viền cho bác
Fernando
Feb 08. 2012
Hi lâu quá mới ghé thăm nhà pác phát triển hơn nữa cho e ăn nhờ tiarffc hehe
Thương Sinh
Feb 11. 2010
Viết thêm nữa đi bác ơi,
Em chưa đã cơn thèm
Mr. Giải Pháp Số
Feb 11. 2010
Share với cậu eBook về Thesis này: http://cid-1ad77d286e0d819c.skydrive.live.com/self.aspx/Thesis/Thesis-Theme-Customization-book.pdf
TBTarc
Nov 10. 2010
Bác GPS cho hỏi có cách nào chèn quảng cáo vào header của thesis không ?
Janice
Feb 08. 2012
Bác cứ đùa, ppayal mở cửa cho vn rồi, cần gì mua acc nữa, mua nó limit rồi biết gỡ làm sao
Jamie
Feb 09. 2012
Vụ dtaabase bị ảnh hưởng server đó (của bác SEO TIP comment dưới đây).