Trước tiên bạn cần xác định được cấu trục của theme như hình dưới đây:

Cấu trúc của theme bao gồm phần header, nav, subnav, phần nồi dung chính dạng 2 cột content-sidebar, phần footer-widget và phần footer. Để thay đổi độ rộng của theme, ta cần thây đổi thuộc tính width của tất cả các phần này.

1. Độ rộng header:

Bạn tìm trong file style.css đoạn:

#header .wrap {
	margin: 0 auto;
	width: 960px;
}

Bạn sẽ thay đổi kích thước 960px trong thuộc tính width bằng kích thước mà bạn muốn. Chẳng hạn mình tăng nó lên thành 1060px:

#header .wrap {
	margin: 0 auto;
	width: 1060px;
}

Bây giờ, bạn lưu lại và kiểm tra kết quả:

Như bạn thấy, phần header đã được mở rộng ra so với lúc trước.

2. Độ rộng nav và subnav

Bạn sẽ làm tương tự như đối với phần header, ta sẽ tìm hai lớp #nav .wrap và #subnav .wrap để thay đổi độ rộng của nó.

#nav .wrap {
	color: #fff;
	font-size: 13px;
	font-weight: bold;
	margin: 0 auto;
    text-shadow: -1px -1px #8e1e03;
	width: 1060px;
}
#subnav .wrap {
	background-color: #222;
	color: #fff;
	margin: 10px auto;
	overflow: hidden;
	width: 1060px;
}

Xem lại kết quả:

3. Độ rồng phần nội dung

Mình định nghĩa phần nội dung ở đây bao gồm 2 phần là content và sidebar. Đây có lẽ là phần mà nhiều bạn gặp khó khăn nhất. Trước tiên bạn thay đổi độ rộng của ID inner từ 960px lên 1060px.

#inner {
	margin: 10px auto;
	overflow: hidden;
	width: 1060px;
}

Tiếp theo, ta sẽ mở rộng phần content và phần sidebar để thu hẹp khoảng cách như bạn thấy bên trên. Để làm được điều này, bạn cần xác định được bạn đang sử dụng kiểu layout nào:

Ở đây mình sử dụng kiểu layout là content-sidebar nên để chỉnh độ rộng phần content mình sẽ tìm lớp .content-sidebar #content:

.content-sidebar #content,
.sidebar-content #content {
	width: 700px;
}

Mình đã tăng độ rộng của phần content từ 630px lên 700px.

Tiếp theo ta chỉnh độ rộng của phần sidebar, ta sẽ tìm lớp .sidebar và tăng độ rộng của nó lên 330px:

.sidebar {
	display: inline;
	float: right;
	font-size: 13px;
	line-height: 20px;
	text-shadow: 1px 1px #fff;
	width: 330px;
}

4. Độ rộng footer-widget và footer

Để chỉnh độ rộng phần footer-widget, ta tìm đoạn sau:

#footer-widgets .wrap {
    margin: 0 auto;
    width: 960px;
}

Tăng độ rộng từ 960px lên thành 1060px:

#footer-widgets .wrap {
    margin: 0 auto;
    width: 1060px;
}

Nhưng khi bạn tăng độ rộng này lên thì khoảng cách giữa 3 cột widget lại tăng lên:

Ta sẽ giãm khoảng cách này xuống bằng cách tăng độ rộng của các cột này từ 300px lên 333px lên:

.footer-widgets-1 {
    float: left;
    padding: 0 20px 0 0;
    width: 333px;
}

.footer-widgets-2 {
    float: left;
    width: 333px;
}

.footer-widgets-3 {
    float: right;
    width: 333px;
}

Cuối cùng, ta sẽ chỉnh độ rộng phần footer, ta sẽ chỉnh thuộc tính width của id #footer .wrap:

#footer .wrap {
	margin: 0 auto;
	width: 1060px;
}

Như vậy là bạn đã hoàn tất việc tùy chỉnh độ rộng cho theme của mình. Chúc các bạn thành công!

The post Tùy chỉnh bề rộng cho Genesis Childthemes appeared first on Raynoblog.

• Responsive Layout: Giao diện tương thích với mọi thiết bị di động.
• SEO Optimized: Thiết kế theo chuẩn tối ưu hóa SEO giúp trang web của bạn đạt thứ hạng cao trong các kết quả tìm kiếm.
• Options Panel: Mặc dù là theme miễn phí nhưng cũng có panel quản lý riêng giúp bạn dễ dàng tùy chỉnh cho theme.
• Unlimited Color Schemes: Thỏa thức sáng tạo màu sắc cho giao diện blog của bạn.
• Related Posts: Hổ trợ hiển thị bài viết liên quan với hình ảnh thumbnails cho mỗi bài viết.
• Custom Widgets: Hổ trợ một số widget riêng như banner quảng cáo với nhiều kích thước, widget Facebook like, Subscribe Widget…

Với các ưu điểm trên, đây sẽ là một sự lựa chọn tuyệt vời cho bạn. Và dưới đây là danh sách 10 themes miễn phí theo chủ đề tạp chí cho bạn lựa chọn.

1. Play Book

Download | Demo

2. Ribbon

Download | Demo

3. Just Blue

Download | Demo

4. Accent Box

Download | Demo

5. Bloggie

 Download | Demo

6. Portal

 Download | Demo

7. Green Chili

 Download | Demo

8. Great

Download | Demo

9. Pin Board

Download | Demo

10. Diary

Download | Demo

Hy vọng các bạn sẽ chọn được cho mình một theme vừa ý trong danh sách các theme miễn phí bên trên. Còn nếu các bạn vẫn chưa vừa ý, các bạn có thể tham khảo thêm các bản theme trả phí tại Mythemeshop, chắc chắn các bạn sẽ hài lòng.

The post 10 Theme WordPress miễn phí cho trang tạp chí từ Mythemeshop appeared first on Raynoblog.

Một số ưu điểm của Fthemes

Với 436 themes được phân lại một cách rõ ràng theo thể loại (General/Blog, News/Magazine, Business/Portfolio), màu sắc theme (black, blue, brown, green…), vị trí sidebar (left, right hoặc cả hai), số cột của theme. Bạn sẽ lựa chọn được cho mình một theme vừa ý nhất và thích hợp nhất cho blog.

Dù bạn tải gói miễn phí nhưng vẫn được hổ trợ Theme Options giúp bạn tùy chỉnh theme một cách dễ dàng.

Hỗ trợ Featured Posts với rất nhiều tùy chỉnh hiễn thị.

Một số themes đẹp từ Fthemes

1. Solidate: Theme đẹp cho blog

2. PressNow: Theme cho trang tin tức3. GamesBlog: Theme cho trang game

4. StartBiz: Theme cho trang công ty

Và còn rất nhiều themes miễn phí đẹp cho bạn lựa chọn. Nếu các bạn đang tìm kiếm một theme WordPress miễn phí thì Fthemes sẽ là một lựa chọn tuyệt vời cho bạn.

The post Fthemes: tải themes WordPress miễn phí tuyệt vời cho bạn appeared first on Raynoblog.

Themes đơn giản là giao diện của blog. WordPress tách themes ra thành một mục riêng nên rất tiện lợi cho việc thiết kế, thay đổi giao diện của blog. Trong cấu trúc source code, themes nằm trong mục \wp-content\themes\, mỗi theme được đặt trong một thư mục riêng. Trong Admin dashboard, mục quảng lý theme là mục Appearance.

Cài đặt themes WordPress

Themes mặc định của WordPress được thiết kế rất đơn giản và không bắt mắt. Vì vậy mọi blogger sử dựng WordPress đều muốn thay đổi theme. Tùy thuộc và khả năng của bạn mà bạn có thể tự thiết kế cho mình một themes vừa ý, hoặc bạn có thể sử dụng các themes thiết kế sẵn được chia sẻ miễn phí hoặc mua các themes được thiết kế chuyên nghiệp hơn.

Các themes tải về thường nằm trong một file có đuôi .zip. Có hai cách để đưa theme này lên blog.

1. Bạn giải nén file .zip, được một thư mục, bạn úp toàn bộ thư mục này lên host của bạn theo đường dẫn  \wp-content\themes\.

2. Bạn đăng nhập vào trang Admin, chọn mục Appearance/themes, chọn thẻ Install Themes, chọn Upload, sau đó chọn đến file .zip của bạn và click Install Now.

Sau khi đã up themes lên blog, bạn vào lại thẻ Manage Themes sẽ thấy themes này nằm trong dánh sách Available Themes. Bạn click vào Activate để áp dụng theme này cho blog.

5 themes WordPress đẹp  và miễn phí

Dưới đây là 5 themes đẹp và miễn phí bạn có thể sử dụng cho blog của mình.

1. Ribbon: một themes được thiết kế theo phong cách đơn giản.

 Xem demo và download

2. Swatch: themes được thiết kế với giao diện rất chuyện nghiệp

 Xem demo và download

3. Learner: themes thể loại tạp chí, phù hợp để làm một blog công nghệ.

 Xem demo và download

4. SilverOrchid: thêm một themes theo thể loại tạp chí

 Xem demo và download

5. Bello: một theme miên phí nhưng có phong cách hết sức chuyên nghiệp.

 Xem demo và download

Hy vọng bạn sẽ chọn được cho mình một themes vừa ý. Cảm ơn các bạn đã đọc bài viết!

The post Cài đặt themes và top 5 themes WordPress miễn phí đẹp cho blog appeared first on Raynoblog.