Showing posts with label Blogger Templates. Show all posts
Showing posts with label Blogger Templates. Show all posts

Wednesday, March 29, 2017

Thêm responsive button css vào blogspot

THÊM RESPONSIVE BUTTON CSS VÀO BLOGSPOT

Đợt rồi mình có chia sẻ template làm trang chia sẻ phần mềm, nhưng mình chợt phát hiện ra button download của họ không chuẩn responsive nên mình viết bài này để chia sẻ với các bạn bộ nút mới.

Ảnh demo:
Để Thêm responsive button css vào blogspot, bạn làm như sau:

Bước 1: Vào Blogger Dashboard > Template (giờ nó là Themes nhé hoặc chủ đề) > Edit HTML. Tìm thẻ </style> và dán code bên dưới lên trên nó
.quangtuyen{list-style:none;text-align:center;margin:10px!important;padding:10px!important;font-size:14px;clear:both;display:inline-block;text-decoration:none!important;color:#FFF!important}
.quangtuyen ul {margin:0;padding:10px}
.quangtuyen li{display:inline;margin:2px;padding:0;list-style:none;}
.gplay,.itunes, .download{padding:12px 15px!important;color:#fff!important;font-weight:700;font-size:14px;font-family:Open Sans,sans-serif;text-align:center;text-transform:uppercase;border-radius:3px;opacity:.95;border:0;letter-spacing:2px;transition:all .2s ease-out}
.gplay {background-color:#01B404;}
.itunes {background-color:#FA58B1;}
.download {background-color:#0B07FA;}
.gplay:hover {background-color:#60B8F4;color:#fff;border-bottom:2px solid #3498DB; opacity:1;}
.itunes:hover {background-color:#49DDAA;color:#fff;border-bottom:2px solid #1ABC84;opacity:1;}
.download:hover {background-color:#07BAFA;color:#fff;border-bottom:2px solid #1ABC84;opacity:1;}
.gplay:before {content:'\f019';display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}
.itunes:before {content:'\f019';display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}
.download:before {content:'\f019';display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}
Lưu lại.

Tiếp đến, vào phần bài đăng, bạn sử dụng code dưới đây để tạo nút:
<div style="text-align: center;">
<ul class="quangtuyen">
<li><a class="gplay" href="YOUR-LINK-HERE" target="_blank">Google Play</a></li>
<li><a class="itunes" href=" YOUR-LINK-HERE" target="_blank">Itunes</a></li>
<li><a class="download" href="YOUR-LINK-HERE" target="_blank">DIRECT DOWNLOAD</a></li>
</ul>
</div>
Bạn bên thêm code này vào phần mẫu bài đăng để sử dụng.

Thay YOUR-LINK-HERE bằng link tải của bạn.

Chúc bạn thành công!

Saturday, March 25, 2017

Chia sẻ Template blogspot làm trang chia sẻ phần mềm (Blue APK)

Blue APK - Responsive and SEO Blogger Template

Không cần nói nhiều nhỉ, hôm nọ Canbllog chia sẻ một template (à, theme chứ nhỉ) làm website chia sẻ phẩn mềm, mình nổi hứng cũng chia sẻ lại 1 template mà mình biết.


Xem ảnh và demo để thấy nó lung linh cỡ nào nhé :D

Blue APK - Responsive and SEO Blogger Template

Monday, February 27, 2017

Chia sẻ template Landing siêu mượt cho giới thiệu công ty hoặc bán hàng

Mình có được anh em bên Getfly tặng cho 1 site giới thiệu sản phẩm dạng landing page cực đẹp: crm.quangtuyen.net.
Thực sự nó load nhanh, nhẹ như chim bay và giao diện cực kỳ đẹp mắt.
Nhưng nó lại là trên nền tảng WP, nên mình đã nhờ em Ngô Quang Trường (admin site http://www.startemplatevn.net/) RIP sang blogspot giúp

Thursday, February 23, 2017

Chia sẻ template video miễn phí làm tạp chí: Technext

Technext là một template blogger miễn phí, thiết kế sạch và hiện đại. Thiết kế chuẩn responsive nên trang web của bạn sẽ trông đẹp trên tất cả các kích cỡ màn hình. 

Nó là một mẫu template khá độc đáo, sẽ làm cho trang web của bạn nổi bật so với trang web khác. 
 - Technext có mười hai màu để lựa chọn;
 - Tích hợp chức năng chia sẻ MXH đẹp mắt;
 - Có tính năng tạo bộ sưu tập, cho phép bạn tải lên hình ảnh để tạo bộ sưu tập của bạn.

Các trang và nội dung các trang cũng được tối ưu hóa cho Adsense. Với sự hỗ trợ widget, họ cung cấp tiêu đề thích hợp và vị trí phần sidebar. 
Bạn có thể sử dụng làm trang chia sẻ video hoặc làm tạp chí tổng hợp.
<Nguồn: oddthemes>

Sunday, October 23, 2016

Chia sẻ template blogspot G Vusion 2 Update chuẩn SEO

G Vusion 2 Update là một template blogspot với bố cục Responsive và phù hợp cho tất cả các blog của Blogger. Nó được thiết kế với  màu sắc đơn giản và hiện đại nhìn, chuẩn SEO, và đã được thiết kế theo xu hướng thiết kế phổ biến nhất hiện nay.


Wednesday, October 19, 2016

G Vusion 2 Responsive Blogger Template


G Vusion 2 Responsive Blogger Template được thiết kế đẹp mắt cho blog cá nhân hoặc trang tin tức. 
Tối ưu trên các thiết bị di động.
Tính năng Khả Dụng
Responsive True 
SEO True 
Google Testing Tool Validator True 
Custom Mobile Version True 
Valid HTML5 Threaded Comment True
2 Column True
Light Base Theme Color True
Simple Flat Design True
Auto Read More with Thumbnail True
Responsive Ad Slot True
Breadcrumbs True
Related Posts with Thumb True
Search Box True
Social Share Button True
Sidebar Tab Widget True
Translation Ready True
Flickr Image Gallery True
Custom 404 Page True
Smooth Scroll back To Top True
Better Print Page Layout True
Custom Subscribe Box Widget True
Sitemap Widget True
Well Documentation True

Tuesday, October 18, 2016

Chia sẻ template Blogger: Template đếm ngược

Tempalte đếm ngược cho blogger cực chất

Chia sẻ đến các bạn một template blogger cực chất. Tem này phù hợp với website làm sự kiện, hoặc kỉ niệm, sinh nhật...

Template được thiết kế phù hợp với các loại thiết bị di động. Phần chỉnh sửa nội dung toàn bộ nằm trong Bố Cục cực kì dễ sử dụng!