Hướng Dẫn Quản Lý và Nhận Thông Báo Facebook Comment Trên Website

Hướng Dẫn Quản Lý và Nhận Thông Báo Facebook Comment Trên Website

[tintuc]Chào bạn, hôm nay mình sẽ hướng dẫn mọi người Quản Lý và Nhận Thông Báo Facebook Comment Trên Website.
Mình đã có một bài viết nói về Cách chèn facebook comment vào blog, Nếu ai chưa có comment facebook ở blog có thể tham khảo nhé.
Bước 1: Bạn truy cập: https://developers.facebook.com
Nếu bạn đã tạo ứng dụng trước kia thì chọn lại một trong các ứng dụng bạn đã tạo, nếu chưa bạn bấm vào "Thêm ứng dụng mới".
Một cửa sổ mới xuất hiện để nhập tên ứng dụng, đây là bài hướng dẫn nên tôi đặt tên ứng dụng của mình là "Test bình luận trên Jweb.vn". Bạn có thể đặt tên tùy ý, ví dụ shop của bạn có tên là Điện Hoa Thanh Vân thì bạn đặt tên ứng dụng là Điện Hoa Thanh Vân.

CÁCH CHÈN VÀ QUẢN LÝ COMMENT FACEBOOK VÀO BLOG

CÁCH CHÈN VÀ QUẢN LÝ COMMENT FACEBOOK VÀO BLOG

[tintuc]
Bài viết này sẽ hướng dẫn bạn đọc cách chèn Facebook Comment nhanh vào trang Blogger của bạn. Chỉ với 4 bước bạn đã có được một tính năng bình luận Facebook ưng ý với mã nguồn của Blogspot
Cách chèn Facebook Comment vào Blogger rất dễ dàng, bạn hãy làm theo 4 bước sau:

1. Tạo một ứng dụng mới trên Facebook

Bạn hãy xem hướng dẫn tạo Facebook App để lấy App ID để thực hiện chèn Facebook Comment vào website và quản lý comment thông qua ứng dụng bạn vừa tạo.

2. Lấy mã code được cung cấp bởi Facebook

Để Get code bạn vào link https://developers.facebook.com/docs/plugins/comments/ chọn các thông số sau:
  • Width: 100% hoặc để chống
  • Number of post: Số lượng comment hiển thị mặc định
  • Color Scheme: Style màu sắc box comment tùy theo site của bạn màu gì bạn chọn cho phù hợp
Chèn mã code được cung cấp bởi Facebook
Hình 1. Chèn mã code được cung cấp bởi Facebook

3. Đặt mã code App ID vào thẻ meta

Khi bạn đã lấy được mã code như hình 1 hãy chèn mã code này tôi đã bổ xung thêm 2 thẻ <meta>
 Bạn hãy thay Your_app_id và User_id bằng số liệu bạn nhận được, riêng User ID bạn lấy bằng cách click vào Avatar Facebook cá nhân của bạn
 Ví dụ trong đoạn code này User ID là 100003820326603

4. Đặt mã code Comment vào bài viết

Có 2 cách để bạn chèn Comment Facebook vào trang Blogger, đầu tiên bạn hãy vào https://www.blogger.com/  -> Chọn Blog muốn chèn > Menu Mẫu -> Chỉnh sửa HTML và làm theo các cách sau:
Cách 1: Thêm mã code sau ngay dưới thẻ <b:include data=’post’ name=’post’/>
Để tìm thẻ trên bạn click chuột vào khu vực thẻ nhấn tổ hợp phím Ctrl+F sẽ bôi vàng vị trí này bạn hãy chèn vào dưới thẻ được bôi vàng đoạn code sau:
 Cách 2: Thêm mã doe này vào sau thẻ </div> của đoạn thẻ <div class=’post-footer’>
Vẫn thực hiện Ctrl+F để tìm <div class=’post-footer’> và kéo xuống tìm thẻ đóng của nó là </div> và chèn vào đoạn code này
Sau đó chọn Lưu mẫu và kiểm tra kết quả nếu trả về kết quả như hình 02 dưới đây là OK
Chèn Facebook Comment nhanh vào Blogger thành công
Hình 2. Chèn Facebook Comment nhanh vào Blogger thành công

Kết luận

Blogspot là một mô hình phát triển có tính mở rất cao, nên bạn có thể dễ dàng chèn Facebook comment vào hoàn toàn không có gì khó. Tuy nhiên bạn đừng quyên thường xuyên theo dõi và quản lý các comment trên https://developers.facebook.com/tools/comments . Cảm ơn bạn đã ghé thăm Blog Hoàng Luyến, chúc bạn thành công!
Cách chèn Facebook Comment nhanh vào Blogger (Blogspot)
2.6/5 (51.71%) 41 votes

[/tintuc]

Template giao diện mẫu blogspot shop thời trang

[giaban]500,000[/giaban]

[tomtat]Mẫu giao diện blogspot bán hàng shop thời trang hoặc các mặt hàng khác như mỹ phẩm, thời trang, theme blog đẹp chuẩn seo, chuẩn mobile ipad[/tomtat]

[link]https://shopsexy-ht.blogspot.com/[/link]

[chitiet]
Template giao diện mẫu blogspot shop thời trang mẫu giao diện blogspot bán quần áo, thời trang đẹp chuẩn seo, giao diện chuẩn .
Theme blogspot bán hoa đẹp, bố cục thiết kế đầy đủ

Đã được tối ưu tốc độ tải trang và tối ưu SEO hiệu quả
Thiết kế giao diện thân thiện với tất cả các thiết bị từ PC, cho đến các thiết bị dị động.
Khả năng tương thích với tất cả các loại trình duyệt phổ biến nhất hiện nay


Kết luận: Theme blogspot bán hàng đẹp tháng 19/3/2019, một Template mẫu giao diện blogger bán hàng đẹp.

Từ khóa: Template blogspot responsive, blogspot template, template blogspot bán hàng, template blogspot đẹp, share template blogspot, rip blogspot chuyên nghiệp, thiết kế blogspot, template blogger đẹp chuẩn seo, blogspot bất động sản. Theme blogger landing page travel du lịch, Theme blogspot landingpage mỹ phẩm

[/chitiet]


Template giao diện mẫu blogspot shop thời trang




Template mẫu giao diện blogger bán hoa

[giaban]200,000[/giaban]

[tomtat]Mẫu giao diện blogspot bán hàng shop hoa hoặc các mặt hàng khác như mỹ phẩm, thời trang, theme blog đẹp chuẩn seo, chuẩn mobile[/tomtat]

[link]https://pdusoftdemo25.blogspot.com/[/link]
[down]https://drive.google.com/drive/folders/1-jkoxfijLd-lKity9BfhiNlqARAHKRxs[/down]
[chitiet]
Theme blogspot bán hoa đẹp, bố cục thiết kế đầy đủ

Đã được tối ưu tốc độ tải trang và tối ưu SEO hiệu quả
Thiết kế giao diện thân thiện với tất cả các thiết bị từ PC, cho đến các thiết bị dị động.
Khả năng tương thích với tất cả các loại trình duyệt phổ biến nhất hiện nay

Kết luận: Theme blogspot bán hàng đẹp tháng 19/5/2018, một Template mẫu giao diện blogger bán hàng đẹp.

Từ khóa: Template blogspot responsive, blogspot template, template blogspot bán hàng, template blogspot đẹp, share template blogspot, rip blogspot chuyên nghiệp, thiết kế blogspot, template blogger đẹp chuẩn seo, blogspot bất động sản. Theme blogger landing page travel du lịch, Theme blogspot landingpage mỹ phẩm

[/chitiet]






Cài đặt chat facebook cho blogspot mới nhất


[tintuc]

Cài đặt chat facebook cho blogspot mới nhất, tạo live chat facebook cho blogspot

Bước 1: copy mã sau dán dưới <body> nếu có sẵn thì xóa đi dán cái này vô

<div id='fb-root'></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId            : '176690452847426',
      autoLogAppEvents : true,
      xfbml            : true,
      version          : 'v2.12'
    });
  };
  (function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "https://connect.facebook.net/vi_VN/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>

Bước 2: Thay ID App của bạn vô dãy số trên. 176690452847426
Truy cập link: https://developers.facebook.com/apps
Nếu chưa có thì bạn phải tạo, cái này không hướng dẫn thêm

Bước 3: Copy dán trước </body>

<div class="fb-customerchat"
 page_id="135641763240991"
 logged_in_greeting="HOATRANWEB CÓ THỂ HỖ TRỢ GÌ CHO BẠN ?"
 logged_out_greeting="Chào bạn. Bạn đang cần xem chủ đề gì ?">
</div>

Trong đó dãy số là ID Fanpage của bạn. Cách lấy ID truy cập link https://findmyfbid.com
Dán link Fanpage của bạn vô và nhấn tìm, xong thì thay thế vô dãy số trên.


Bước 4: Truy cập vô fanpage của bạn và làm theo như hình sau

Cài đặt - Nền tảng Messenger - Miền được đưa vào danh sách hợp lệ




Xong nhấn lưu lại. Quay lại website và test.
Chúc bạn thành công.

[/tintuc]

Mẫu giao diện blogspot bán túi xách balo thời trang

[giaban]200,000[/giaban]
[tomtat]Mẫu giao diện blogspot bán balo túi xách đẹp, các mặt hàng thời trang[/tomtat]

[chitiet]
Mẫu giao diện blogspot bán hàng đẹp, các mặt hàng thời trang, balo túi xách, giao diện đẹp chuẩn seo responsive, mẫu blogspot đẹp, web bán hàng full chức năng giỏ hàng online.
Theme blogspot shop online đẹp nhất, một mẫu blogspot bán hàng chất lượng.
themepdu cung cấp thiết kế mẫu blogspot bán hàng, tin tức bất động sản theo yêu cầu.
[/chitiet]

[link]https://pdusoftdemo26.blogspot.com/[/link]
[down]/https://drive.google.com/drive/folders/1iZs-S7obE-3MVaLUpAu_PiLGrlw1GhI5[/down]


Tạo nút gọi điện thoại cho blogspot đơn giản

[tintuc]



Copy đoạn code dán trước </body> và có thể chỉnh sửa một số giá trị cho phù hợp.

<style>
    .hotline {
    position: fixed;
    left: 15px;
    bottom: 10px;
    top: initial !important;
    list-style: none;
    background-color: #fff;
    padding: 10px 6px 4px;
    z-index: 99999;
    border-radius: 20px;
    border: 1px solid #77b3d4;
    }

    .hotline a {
        font-size: 18px;
        color: #d80027;
        font-weight: 600
    }

    .phone img {
        margin-top: -9px;
        vertical-align: middle
    }

    .number {
        color: #060
    }
</style>


<div class="hotline">
<a class="phone" href="tel:0971539681">
<img alt="Hotline" src="https://2.bp.blogspot.com/-b-vuGeTB8B8/Wo2b3xIhwaI/AAAAAAAAE18/MMGBIhSqTjc6opXxPyiVANIpuKh5tdRKACLcBGAs/s1600/phone-32.png" /><span class="number">0971539681</span></a>
</div>

[/tintuc]

Template blogspot bất động sản nhà đất đẹp

[giaban]200,000[/giaban]

[tomtat]
Mẫu giao diện blogspot bất động sản chuẩn seo phù hợp với những ai đang có nhu cầu làm web blogspot nhà đất, blogspot chung cư, blogspot bán dự án bất động sản.
[/tomtat]

[link]https://pdusoftdemo46.blogspot.com/[/link]
[down]https://drive.google.com/drive/folders/1joS67D8aB4V8AjbbXOwaEJz-cCnmrmUa[/down]
[chitiet]

Mẫu giao diện blogspot bất động sản chuẩn seo phù hợp với những ai đang có nhu cầu làm web blogspot nhà đất, blogspot chung cư, blogspot bán dự án bất động sản. Giao diện template blogspot bất động sản đẹp để làm web nhà đất, web blogspot bất động sản chuẩn seo. Template blogspot bất động sản được mình thiết kế giao diện template bất động sản chuẩn mobile.

Giao diện template blogspot bất động sản đẹp

Giao diện đã được thiết bố bố cục, thao tác nhanh gọn, tiện lợi

Kết luận: Theme blogspot giới thiệu công ty đẹp


[/chitiet]












Hướng dẫn tạo quảng cáo adsense hai bên web blogspot

[tintuc]
Hướng dẫn tạo quảng cáo adsense cố định hai bên web blogspot.



Bước 1: Vô adsense tạo và lấy mã banner dọc 160 x 600 hoặc nhỏ hơn vì to quá sẽ không đủ chỗ
Bước 2: Copy dán trước </body>

<style>
    .float-ads {
        position: fixed;
        top: 75px;
        z-index: 9000
    }
@media screen and (max-width: 680px) {
    .float-ads {display:none;}
}
</style>
<div class='float-ads' style='left: 0px;margin-left: -7px;'>

ADS TRÁI

</div>
<div class='float-ads' style='right: 0px;margin-left: -7px;'>

ADS PHẢI

</div>

Các bạn chỉnh các thông số cho phù hợp

Sau đó lưu lại
[/tintuc]


Cung cấp mẫu giao diện template blogspot bán hàng đẹp

Bài 3 - Cách lấy dữ liệu bài viết ra ngoài trang chủ blogpsot

[tintuc]
Bài 1:  Hướng dẫn thiết kế template blogspot
Bài 2: Hướng dẫn sắp xếp làm đẹp bố cục blogpsot

Bài này mình hướng dẫn cách lấy bài viết ra ngoài trang chủ blogspot

Trước tiên các bạn quay lại blog các bạn vô viết vài bài để test nhé. Xong các bạn vô chủ đề tìm tới phần CỘT GIỮA (COL-6)


Các bạn xóa nội dung tạm bên trong đi và thêm dòng code sau vào nó

<b:section class='main' id='mainpost' showaddelement='yes'>
<b:widget id='Blog1' locked='false' title='Bài đăng trên Blog' type='Blog'/>
</b:section>

Sau đó nhấn lưu lại và view link blog lên xem kết quả, bài viết đã được load ra ngoài trang chủ. Tuy nhiên nó lại dài quá. Nên mình cần thu gọn bài viết lại.

Tiếp theo mình hướng dẫn cách thi gọn bài viết trên trang chủ:

Bây giờ các bạn vô trong giao diện nhấn Ctrl + F tìm <data:post.body/> Xong nhấn tìm cái đích cần tìm là cái <data:post.body/> thứ 2 từ trên xuống. Sau đó bạn thay code sau vô chữ  <data:post.body/>


<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div>
<b:if cond='data:post.thumbnailUrl'>
<img class='post-thumbnail' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' height='72px' width='72px'/>
<b:else/>
<img alt='no image' class='post-thumbnail' height='72px' src='https://lh3.googleusercontent.com/-AUxGwRmuU-E/U8ElIkyjdPI/AAAAAAAAITM/A2uBu8llLJ0/s0/noimage.jpg' width='72px'/>
</b:if>
<data:post.snippet/>
</div>
<div class='jump-link'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
<b:else/>
<data:post.body/>
</b:if>
<b:else/>
<data:post.body/>
</b:if>

Nhấn lưu lại, tiếp theo ta thêm 1 chút CSS cho nó nhé, copy css sau dán trước </head>

<style>
  .post-thumbnail{
width: 23%;
    float: left;}
.post-title {
    color: #494949;
    font-family: Raleway, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1em;
    text-decoration: none;
    text-align: left;
    margin-top: 25px;
}
  .jump-link a{float: right;}
</style>

sau đó nhấn lưu lại, view link blog và xem kết quả. CSS mình chỉ là tạm thời nên các bạn cần chỉnh sao cho đẹp, chuẩn.

Bây giờ bạn có thể vô bố cục add các tiện ích như: nhãn, phổ biến, hình, ....

Tổng kết: như vậy là mình đã hướng dẫn load dữ liệu bài viết ra trang chủ
[/tintuc]

Bài 2 - Sắp xếp làm đẹp bố cục blogspot

[tintuc]

Tiếp theo bài 1: Hướng dẫn thiết kế template blogspot cơ bản
Bài này mình sẽ hướng dẫn làm đẹp bố cục blogpsot, sắp xếp sao cho hợp lý dễ thao tác và quản lý nó.

Dưới </b:skin> bạn thêm
    <b:template-skin>
      <![CDATA[
]]>
    </b:template-skin>

Sau đó bạn thêm b:version='2' class='v2' vào chỗ html đầu tiên như hình dưới. Sau đó nhấn lưu lại


Giải thích: Template muốn có thẻ

    <b:template-skin>
      <![CDATA[
]]>
    </b:template-skin>

Bắt buộc phải có dòng này  b:version='2' class='v2' phiên bản 2 ý


Tiếp theo bạn copy dòng này dán vô trong thẻ <b:template>

body#layout ul{list-style-type:none;list-style:none}
body#layout ul li{list-style-type:none;list-style:none}
body#layout .col-3 {width:25%; float:left}
body#layout .col-6 {width:50%; float:left;}

Giải thích nhé: 2 dòng đầu là xóa các dấu chấm xuất hiện ở bố cục
2 dòng sau là ta căn chỉnh độ rộng cho các cột (trai - phải)

Mẫu mình làm gồm có 3 cột (TRÁI - GIỮA - PHẢI)

TRÁI + PHẢI = 50% (chung class là .col-3)
GIỮA = 50% (class là .col-6)

Cách gọi CSS của bố cục là body#layout phía trước sau đó đến class css hoặc id css xem như trên



col-3 là 2 cột 2 bên (trái - phải)
col-6: là phần main nằm giữa hai cột kia (làm sau nhé)

Tổng kết: Với bài này mình đã hướng dẫn cách làm đẹp bố cục blogspot, hy vọng nó giúp ích cho các bạn mới bước chân vô blog.

Các bạn tải mẫu bài 2 tại đây : Link tải

Bài sau mình hướng dẫn cách lấy bài viết ra ngoài trang chủ

[/tintuc]

Bài 1 - Hướng dẫn thiết kế template blogspot

[tintuc]
Sau đây mình xin hướng dẫn thiết kế 1 template blogspot đơn giản, bao gồm cả thiết kế bố cục, cách lấy bài viết.

Mục đích bài viết là để cho các bạn hiểu cách hoạt động cấu trúc của 1 blogger. Chứ không phải thiết kế 1 giao diện chuẩn 100% rồi mang bán, cái đó còn phụ thuộc vào kiến thức của mỗi người. Bài này mình chỉ cách hướng dẫn cơ bản, cho những bạn muốn tìm hiểu, tự làm blogspot cho riêng mình.

Các bạn nhìn bên dưới, phần thân web được chia làm 3 cột: Trái - Main - Phải

Xem link mẫu: https://bai1-ht.blogspot.com/


Bước 1: Tạo mới 1 blog (đặt tên và link đường dẫn)
Sau khi tạo xong các bạn vô link Mẫu blogspot trắng tinh copy dán đè lên giao diện cũ vừa tạo sau đó nhấn lưu lại


Đó là cấu trúc của 1 template blogspot trắng tinh, mình thường bắt đầu đề thiết kế 1 mẫu mới
- Giải thích: 1 template bắt buộc phải có 1 thẻ <b:skin> và 1 thẻ <b:section> thì mới lưu được nhé, nếu thiếu template sẽ báo lỗi và không thể nào lưu được.

Bước 2: Thêm thẻ meta responsive mobile
Copy link dưới đặt dưới <head>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
Sau đó nhấn lưu lại


Bước 3: Thêm CSS mà mình đã chuẩn bị

* {
box-sizing: border-box;
}
img {
width: 100%;
height: auto;
}
.row:after {
content: "";
clear: both;
display: table;
}
[class*="col-"] {
float: left;
padding: 15px;
width: 100%;
}
@media only screen and (min-width: 600px) {
.col-s-1 {width: 8.33%;}
.col-s-2 {width: 16.66%;}
.col-s-3 {width: 25%;}
.col-s-4 {width: 33.33%;}
.col-s-5 {width: 41.66%;}
.col-s-6 {width: 50%;}
.col-s-7 {width: 58.33%;}
.col-s-8 {width: 66.66%;}
.col-s-9 {width: 75%;}
.col-s-10 {width: 83.33%;}
.col-s-11 {width: 91.66%;}
.col-s-12 {width: 100%;}
}
@media only screen and (min-width: 768px) {
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}
}
html {
font-family: "Lucida Sans", sans-serif;
}
.header {
background-color: #9933cc;
color: #ffffff;
padding: 15px;
}
.menu ul {
list-style-type: none;
margin: 0;
padding: 0;
}
.menu li {
padding: 8px;
margin-bottom: 7px;
background-color :#33b5e5;
color: #ffffff;
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
.menu li:hover {
background-color: #0099cc;
}
.aside {
background-color: #33b5e5;
padding: 15px;
color: #ffffff;
text-align: center;
font-size: 14px;
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
.footer {
background-color: #0099cc;
color: #ffffff;
text-align: center;
font-size: 12px;
padding: 15px;
}

Copy CSS ở trên dán vô trong thẻ <b:skin> CSS ở trên </b:skin>
Cách khác là bạn copy CSS ở trên cho vào trong thẻ <style> CSS ở trên </style> và đặt nó trước </head>
Thẻ <b:skin> khi chạy trên trình duyệt nó tự động đổi thành thẻ <style>

Bước 4: Tạo dòng chữ logo

Dưới <body> thêm html sau

<div class="header">
  <h1>Logo - Template blogspot</h1>
</div>

Sau đó nhấn lưu lại và view blog lên xem nó như thế nào. Đó là xong phần header giờ tới phần thân web bao gồm 2 cột TRÁI - MAIN - PHẢI

Dưới phần header vừa thêm các bạn copy html sau dán dưới nó

<div class="row">
    <div class="col-3 col-s-3 menu">
        CỘT TRÁI
    </div>

    <div class="col-6 col-s-9">
        MAIN
    </div>

    <div class="col-3 col-s-12">
        CỘT PHẢI
    </div>
</div>


Đó là mình chia làm 3 cột như ban đầu thiết kế. Tiếp theo mình làm phần cột trái, mình sẽ làm luôn phần widget bố cục cho nó luôn nhé.

A. PHẦN CỘT TRÁI

Bạn xóa chữ CỘT TRÁI đi và copy dòng sau dán vô chỗ cũ
    <b:section id='cot-trai'  showaddelement='yes'></b:section>

Sau đó nhấn lưu lại và xóa thẻ <b:section> phái dưới đi vì không cần nữa
<b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='yes'/>
Sau đó vô bố cục xem. nó đã xuất hiện tiện ích widget tên cot-trai



Các bạn nhấn Thêm tiện ích - Chọn HTML/Javascript

Dán đoạn html sau vô rồi lưu lại

  <ul>
    <li>Nhãn 1</li>
    <li>Nhãn 2</li>
    <li>Nhãn 3</li>
    <li>Nhãn 4</li>
  </ul>

Rồi bạn view link blog lên và xem kết quả.

B. PHẦN CỘT PHẢI

Cũng tương tự như phần cột trái, các bạn copy code sau dán đè vô chữ CỘT PHẢI
    <b:section id='cot-phai' showaddelement='yes'></b:section>



Sau đó lưu lại và vô bố cục nó đã xuất hiện tiện ích widget tên cot-phai

Các bạn nhấn Thêm tiện ích - Chọn HTML/Javascript và copy đoạn html dưới dán vô và lưu lại

<div class="aside">
    <h2>Theme blogspot bán hàng</h2>
    <p>Chania is a city on the island of Crete.</p>
    <h2>Theme blogpsot BĐS</h2>
    <p>Crete is a Greek island in the Mediterranean Sea.</p>
    <h2>Theme blogpsot tin tức?</h2>
    <p>You can reach Chania airport from all over Europe.</p>
  </div>

Sau đó view link blog và xem kết quả

C. PHẦN FOOTER

Bạn thêm html như sau: trước </body>

<div class="footer">

</div>

Như hình dưới nhé, các bạn click vô con số bên trái  để nó thu gọn lại cho dễ nhìn


3 phần trên nó song song với nhau, trong "footer" bạn copy dán thẻ <b:section> để tạo widget
<b:section id='footer' showaddelement='yes'></b:section>


Sau đó lưu lại và vô bố cục xem nó xuất hiện chưa. Mình vô thì có nhé


Các bạn nhấn Thêm tiện ích - Chọn HTML/Javascript
Dán đoạn html sau và lưu lại
  <p>Template blogspot bán hàng chuẩn seo - www.hoatranweb.com</p>
View link blog và xem kết quả.


D. PHẦN MAIN

Phần này là để lấy dữ liệu từ bài post của blog ra, Bài 2 mình sẽ hướng dẫn sau.

Tạm thời bạn tìm chữ MAIN và thêm dòng html sau và lưu lại

        <h1>
          Thiết kế template blogspot
        </h1>
        <p>
          Template blogspot bán hàng chuẩn seo, rip blogspot chuyên nghiệp thiết kế web blogger theo yêu cầu
        </p>
        <img src="https://www.w3schools.com/css/img_chania.jpg" width="460" height="345"/>

Xem hình:


Sau đó lưu lại view link blog và xem kết quả
Đây là kết quả blog mình vừa tạo nhé: https://bai1-ht.blogspot.com/
Với bài hướng dẫn này mình đã tạo được 1 blogspot đơn giản responsive mobile.

Tải bản mẫu tại đây: 

Với bài sau mình hướng dẫn cách sắp xếp bố cục + cách lấy bài viết ra ngoài trang chủ.


[/tintuc]

Theme blogspot show hình gái xinh đẹp

[giaban]400,000[/giaban]
[link]http://www.blogspotbanhang.club/[/link]
[tomtat]
Giới thiệu mẫu blogspot chia sẻ hình ảnh gái xinh, giao diện đẹp responsive mobile
[/tomtat]

[chitiet]

Giới thiệu mẫu blogspot chia sẻ hình ảnh đẹp
Tác giả: Hòa Trần
Chức năng:
- Chia sẻ hình ảnh, album ảnh, hot girl chân dài, chân ngắn, album kỷ niệm... show hình.
- Zoom ảnh trực tiếp trang chủ, next - previous.
- Giao diện bootstrap responsive mobile
Giá: IB
Nhận rip thiết kế theo yêu cầu.

Giới thiệu mẫu blogspot chia sẻ hình ảnh gái xinh, giao diện đẹp responsive mobile, Template blogspot chia sẻ hình ảnh girl xinh, blogspot hình ảnh, blogspot show hình, blogspot zoom ảnh, blogspot slide.

Chức năng zoom ảnh trực tiếp ở trang chủ, next- pre sử dụng rất tiện lợi với bàn phím mũi tên lên xuống.

Dịch vụ rip template blogspot chuyên nghiệp, thiết kế blogspot theo yêu cầu, Theme blogspot bán hàng đẹp chuẩn seo

Liên hệ: Hòa Trần
Facebook: https://www.facebook.com/hoatran.gl
ĐT: 097 1539 681
Email: tranhoa1991gl@gmail.com


[/chitiet]



Tổng hợp mẫu giao diện template blogspot bán hàng chuẩn seo

[tintuc]
Tổng hợp mẫu giao diện template blogspot bán hàng chuẩn seo đẹp mới nhất được mình thiết kế. Đáp ứng nhu cầu sử dụng template blogspot làm website bán hàng đẹp. Những mẫu blogspot bán hàng chuẩn seo, chuẩn meta H1 H2 H3 H4... tối ưu code

Việc chọn những mẫu template blogspot phải chuẩn seo thì sẽ giúp cho website blogspot của bạn dễ top google hơn cho việc seo blogspot top google

Những mẫu blogspot template blogger bán hàng dưới đây có thể đáp ứng được việc seo blogspot top google

1. Template blogspot bán hàng mobile điện thoại, giao diện blogspot bán hàng đẹp nhất hiện nay
Xem chi tiết tại: Template blogspot điện thoại đẹp
2. Template blogspot bán hàng tết đẹp chuẩn responsive
Xem chi tiết tại: Theme blogspot bán hàng tết đẹp
3. Template blogspot bán hàng thời trang đẹp
4. Template blogspot bán hàng mỹ phẩm chuẩn seo đẹp nhất
5. Template blogspot bất động sản đẹp

[/tintuc]

Rip template blogspot chuyên nghiệp rip blogspot đẹp

[tintuc]
Dịch vụ thiết kế rip blogspot đẹp theo yêu cầu, giao diện 90 - 98% so với bản gốc.
Rip template blogspot
Rip theme blogger
Rip blogspot
Rip blogger theme
Thiết kế blogpsot
Thiết kế theme blogger
Thiết kế web blogspot

Thời gian 1 - 2 ngày làm việc, Rip chuẩn, nhanh chóng

LH: Hòa Trần
ĐT: 097 1539 681

[/tintuc]

Template blogspot cá nhân đẹp chuẩn responsive

[giaban]200,000[/giaban]

[tomtat]
Template blogspot tin tức cá nhân đẹp chuẩn mobile giao diện đẹp nhẹ, mẫu blogspot cá nhân đẹp nhất.
[/tomtat]

[link]https://themeblogdepp-ht.blogspot.com/[/link]
[down]https://drive.google.com/drive/folders/1sTAcJYD4yCg8HF_KMSpdQ7LkNmKWs_4L[/down]
[chitiet]

Giao diện rip template blogspot giống tới 98% so với bản gốc

Giới thiệu theme blogspot tin tức cá nhân đẹp, Template blogspot tin tức đẹp, Theme blogger cá nhân

Theme blogspot làm web tin tức cho cá nhân , mẫu blogspot làm website tin tức chuẩn seo load nhanh, được mình thiết kế chuẩn seo. Một mẫu theme blogger  tin tức đẹp không nên bỏ qua.

Đã được tối ưu tốc độ tải trang và tối ưu SEO hiệu quả
Thiết kế giao diện thân thiện với tất cả các thiết bị từ PC, cho đến các thiết bị dị động.
Khả năng tương thích với tất cả các loại trình duyệt phổ biến nhất hiện nay

[/chitiet]

Template blogspot cá nhân đẹp chuẩn responsive









Template Giao diện mẫu blogger giáo dục

[giaban]600,000[/giaban]

[tomtat]
Template blogspot website giáo dục đẹp, giao diện blogspot giáo dục chuẩn seo, load nhanh, mẫu mượt mà, theme blogger bán hàng điện thoại

[/tomtat]

[link]https://tintuc-ht.blogspot.com/[/link]


[chitiet]
Phong cách thiết kế cổ điển với những đường nét tối giản, màu sắc trung tính, giao diện Đông Á là sự lựa chọn tuyệt vời cho những website blogspot giáo dục, website blogspot du lịch...

Theme blogspot làm web giáo giục, mẫu blogspot làm website giáo dục chuẩn seo load nhanh, được mình thiết kế chuẩn seo. Một mẫu theme blogger dịch vụ không bên bỏ qua

Đã được tối ưu tốc độ tải trang và tối ưu SEO hiệu quả
Thiết kế giao diện thân thiện với tất cả các thiết bị từ PC, cho đến các thiết bị dị động.
Khả năng tương thích với tất cả các loại trình duyệt phổ biến nhất hiện nay
Dễ dàng trình bày dạng text, hình ảnh, sản phẩm
Form đăng ký dễ sử dụng đẹp mắt


[/chitiet]










Template blogspot bán điện thoại mobile

[giaban]200,000[/giaban]

[tomtat]
Template blogspot bán điện thoại đẹp, giao diện blogspot chuẩn seo, load nhanh, mẫu mượt mà, theme blogger bán hàng điện thoại

[/tomtat]

[link]https://pdusoftdemo27.blogspot.com/[/link]
[down]https://drive.google.com/drive/folders/1RSvwKhg9IEZ__Ix8j6Z2Eb-M_e4pxrAU[/down]
[chitiet]
Theme blogspot điện thoại load nhanh, mẫu blogspot làm website bán hàng điện thoại đẹp, được mình thiết kế chuẩn seo. Một mẫu theme blogger bán hàng không bên bỏ qua

Đã được tối ưu tốc độ tải trang và tối ưu SEO hiệu quả
Thiết kế giao diện thân thiện với tất cả các thiết bị từ PC, cho đến các thiết bị dị động.
Khả năng tương thích với tất cả các loại trình duyệt phổ biến nhất hiện nay
Dễ dàng trình bày dạng text, hình ảnh, sản phẩm
Form đăng ký dễ sử dụng đẹp mắt
[/chitiet]




Template blogspot bán điện thoại mobile

Template blogspot bán điện thoại mobile

Blogger theme template mỹ phẩm đẹp

[giaban]200,000[/giaban]

[tomtat]Mẫu giao diện blogspot bán hàng mỹ phẩm đẹp chuẩn seo, chuẩn mobile, template blogspot đẹp bán hàng shop mỹ phẩm[/tomtat]

[link]https://pdusoftdemo28.blogspot.com/[/link]
[down]https://drive.google.com/drive/folders/1QvhDlZK48BgsiWxkC0AaIy8G9AZyTP-m[/down]
[chitiet]
Theme blogspot mỹ phẩm đẹp chuẩn seo

Đã được tối ưu tốc độ tải trang và tối ưu SEO hiệu quả
Thiết kế giao diện thân thiện với tất cả các thiết bị từ PC, cho đến các thiết bị dị động.
Khả năng tương thích với tất cả các loại trình duyệt phổ biến nhất hiện nay
Dễ dàng trình bày dạng text, hình ảnh, sản phẩm
Form đăng ký dễ sử dụng đẹp mắt

[/chitiet]


Blogger theme template mỹ phẩm đẹp