Tao MENU DROPDOWN cho blogger

 

Tạo Menu Dropdown cho blogger

    Menu là một công cụ không thể thiếu cho một trang blog đạt chuẩn. Ngoài tác dụng trang trí cho blog và giúp cho người truy cập dễ dàng tìm kiếm, đi tới các danh mục chứa thông tin trong đó, menu còn có tác dụng SEO (tối ưu hóa tìm kiếm) cho blog.
    Theo email yêu cầu của một số bạn bè. Caocongkien 360 chia sẻ với các bạn cách tạo menu dropdown (có menu con xổ xuống) cho blog. Các bạn có thể xem mẫu menu này ngay trên đầu trang.

Cách tạo menu dropdown:

1. Đăng nhập vào blog, bấm "Thiết kế" - "Trang tổng quan", bấm vào "Mẫu", bấm tiếp "Chỉnh sửa HTML".
2. Tìm thẻ: ]]></b:skin>  . 
3. Chèn đoạn mã trong khung dưới đây vào phía trên thẻ: ]]></b:skin> vừa tìm được. 

#mbtnavbar {
background: #060505;
width: 960px;
color: #FFF;
margin: 0px;
padding: 0;
position: relative;
border-top:0px solid #960100;
height:35px;
}
#mbtnav {
margin: 0;
padding: 0;
}
#mbtnav ul {
float: left;
list-style: none;
margin: 0;
padding: 0;
}
#mbtnav li {
list-style: none;
margin: 0;
padding: 0;
border-left:1px solid #333;
border-right:1px solid #333;
height:35px;
}
#mbtnav li a, #mbtnav li a:link, #mbtnav li a:visited {
color: #FFF;
display: block;
font:normal 12px Helvetica, sans-serif; margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
}
#mbtnav li a:hover, #mbtnav li a:active {
background: #BF0100;
color: #FFF;
display: block;
text-decoration: none;
margin: 0;
padding: 9px 12px 10px 12px;
}
#mbtnav li {
float: left;
padding: 0;
}
#mbtnav li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 160px;
margin: 0;
padding: 0;
}
#mbtnav li ul a {
width: 140px;
}
#mbtnav li ul ul {
margin: -25px 0 0 161px;
}
#mbtnav li:hover ul ul, #mbtnav li:hover ul ul ul, #mbtnav li.sfhover ul ul, #mbtnav li.sfhover ul ul ul {
left: -999em;
}
#mbtnav li:hover ul, #mbtnav li li:hover ul, #mbtnav li li li:hover ul, #mbtnav li.sfhover ul, #mbtnav li li.sfhover ul, #mbtnav li li li.sfhover ul {
left: auto;
}
#mbtnav li:hover, #mbtnav li.sfhover {
position: static;
}
#mbtnav li li a, #mbtnav li li a:link, #mbtnav li li a:visited {
background: #BF0100;
width: 120px;
color: #FFF;
display: block;
font:normal 12px Helvetica, sans-serif;
margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
z-index:9999;
border-bottom:1px dotted #333;
}
#mbtnav li li a:hover, #mbtnavli li a:active {
background: #060505;
color: #FFF;
display: block; margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
}

Chú ý: Con số (960) được tô màu đỏ, nằm trong nền xanh ở đoạn mã trên là độ rộng của thanh menu. Các bạn có thể thay đổi cho phù hợp với blog. 
Sau khi dán mã, tìm ở cuối đoạn mã vừa dán và xóa dòng nhắc nhở này: "Bài gốc: http:// ......................... Bài viết đã được đăng ký bản quyền. Bạn vui lòng ghi rõ nguồn để thể hiện nhân cách của bạn! Xin cảm ơn!" 
4. Bấm "Lưu mẫu" để lưu vào template.

5. Lặp lại các thao tác ở bước số 1 và bấm vào "Bố cục", bấm tiếp "Thêm tiện ích" [1]  (ngay dưới tiêu đề blog - xem ảnh trên), chọn và thêm "HTML/JavaScript" [2] trong bảng tiện ích hiện ra. Để trống tiêu đề và dán đoạn mã trong khung dưới vào phần nội dung:

    <div id='mbtnavbar'> 

 <ul id='mbtnav'>
        <li>
        <a href=' link trang chủ'>TRANG CHỦ</a></li>
        <li>
 <a href='link chuyên mục'>TÊN MỤC</a></li>
        <li>
          <a href='link chuyên mục'>TÊN MỤC</a></li>
  <li>
<a href='link chuyên mục'>TÊN MỤC</a></li>
  <li>
 <a href='link chuyên mục'>TÊN MỤC</a>
<ul>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
              </ul>
        </li>
  <li>
           <a href='link chuyên mục'>TÊN MỤC</a>
            <ul>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
         </ul>
      </li>          
 <li>
           <a href='link chuyên mục'>TÊN MỤC</a>
            <ul>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
                <li><a href='link nhãn'>TÊN NHÃN </a></li>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
              </ul>
          </li>
         <li>
           <a href='link chuyên mục'>TÊN MỤC</a>
            <ul>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
                <li><a href='link nhãn'>TÊN NHÃN</a></li>
              </ul>
            </li>
            <li>
           <a href='link chuyên mục'>TÊN MỤC</a>
            <ul>
            <li><a href='link nhãn'>TÊN NHÃN</a></li> 
            <li><a href='link nhãn'>TÊN NHÃN</a></li>
            <li><a href='link nhãn'> TÊN NHÃN</a></li>
            <li><a href='link nhãn'>TÊN NHÃN</a></li>             
       </ul>

  </li>
<li>        
</li>

</ul>  
</div>

Lưu ý: 
- Sau khi dán mã, tìm ở cuối đoạn mã vừa dán và xóa dòng nhắc nhở này: "Bài gốc: http:// ......................... Bài viết đã được đăng ký bản quyền. Bạn vui lòng ghi rõ nguồn để thể hiện nhân cách của bạn! Xin cảm ơn!".
- Phần mã nằm trong nền xanh ở khung trên là các menu con xổ xuống. 
- Thay "link chuyên mục" bằng link của các danh mục hoặc trang tĩnh trong blog; "tên mục" bằng tên các trang hoặc danh mục trong blog của các bạn.
- Thay "linh nhãn" bằng link các nhãn trong blog; "tên nhãn" bằng tên của các nhãn trong blog của các bạn. 

6. Bấm "Lưu" và định vị tiện ích vừa tạo rồi bấm "Lưu sắp xếp" [3] là xong. 
Mời các bạn trở lại trang chủ xem kết quả!

Nguồn: Nguyễn Văn Cường (Caocongkien) 

Read more »

Tạo menu xổ xuống trong blogspot đơn giản nhất Menu Drop down cho Blogger

 

Blogspot của bạn có quá nhiều thứ cần chèn vào menu nhưng bạn không muốn menu quá dàn trải và chiếm nhiều diện tích trang. Vậy bạn có thích 1 thanh menu đơn giản dễ quản lý nhưng vẫn đủ đẹp để áp dụng cho thanh menu cố định trên website blogspot của mình khi cuộn trang hiển thị được lung linh hơn không? Trong bài viết này Giupbankinhdoanh sẽ chỉ bạn cách làm menu xổ xuống Drop Down cơ bản nhất cho Blogspot, giúp bạn có 1 thanh menu ấn tượng!

Menu xổ xuống trong blogspot là một trong những thành phần cơ bản nhất cho một trang web có nhiều điều hướng. Tạo 1 menu đổ xuống theo kiểu Drop Down của Blogspot là việc đơn giản bản có thể tự mình thực hiện khi làm theo các hướng dẫn chi tiết đơn giản dưới đây.

Làm Thế Nào Để Làm Menu Xổ Xuống (Drop down)?

Bước 1: Truy cập vào trang quản trị Blogger -> Design (Thiết kế)  -> Page Elements (Bố cục) -> Hãy chọn Thêm HTML/JavaScript 

Bước 2: Sau khi chọn thêm HTML/JavaScript hãy paste đoạn code sau vào:

<div id='drnavbar'>
    <ul id='drnav'>
        <li> <a href='#'>Trang chủ</a> </li>
        <li> <a href='#'>Tên mục</a> </li>
        <li> <a href='#'>Tên mục</a> </li>
        <li> <a href='#'>Menu</a>
            <ul>
                <li><a href='#'>Menu 1</a></li>
                <li><a href='#'>Menu 2</a></li>
                <li><a href='#'>Menu 3</a></li>
            </ul>
        </li>
    </ul>
</div>

Trong đó:

+ Dấu # sẽ được thay bằng các đường dẫn đến các chủ đề mà các bạn muốn nó xuất hiện
+ Chữ màu xanh là nội dung hiển thị của các chủ đề+ Thẻ <ul>…</ul> là thẻ dùng để mở rộng tạo menu xổ xuống (drop down). Như đoạn code trên thì khi  trỏ chuột vào Menu, sẽ xổ xuống các Menu 1,2,3 sau đó lưu lại.
+ Thẻ <ul>…</ul> là thẻ dùng để mở rộng tạo menu xổ xuống (drop down). Như đoạn code trên thì khi  trỏ chuột vào Menu, sẽ xổ xuống các Menu 1,2,3

Sau đó lưu lại đi!

Bước 3: Các bạn tìm truy cập đến mục Design (Mẫu) -> Edit HTML (Chỉnh sửa HTML). Tìm kiếm đến thẻ ]]></b:skin> và thêm đoạn CSS này lên trên nó:

/*—– Drop Down Menu —-*/ #
drnavbar {
    background: #060505;     width: 960px;     color: # FFF;margin: 0 px;padding: 0;position: relative;border - top: 0 px solid #960100;         height:35px;}# drnav {
        margin: 0;padding: 0;
    }#
    drnav ul {
        float: left;list - style: none;margin: 0;padding: 0;
    }#
    drnav li {
        list - style: none;
        margin: 0;
        padding: 0;
        border - left: 1 px solid #333;         border-right:1px solid # 333;
        height: 35 px;
    }#
    drnav li a,
    #drnav li a: link,
    #drnav li a: visited {
        color: #FFF;display: block;font: normal 12 px Helvetica,
        sans - serif;margin: 0;padding: 9 px 12 px 10 px 12 px;text - decoration: none;
    }#
    drnav li a: hover,
    #drnav li a: active {
        background: #BF0100;color: #FFF;display: block;text - decoration: none;margin: 0;padding: 9 px 12 px 10 px 12 px;
    }#
    drnav li {
        float: left;padding: 0;
    }#
    drnav li ul {
        z - index: 9999;
        position: absolute;
        left: -999 em;
        height: auto;
        width: 160 px;
        margin: 0;
        padding: 0;
    }#
    drnav li ul a {
        width: 140 px;
    }#
    drnav li ul ul {
        margin: -25 px 0 0 161 px;
    }#
    drnav li: hover ul ul,
    #drnav li: hover ul ul ul,
    #drnav li.sfhover ul ul,
    #drnav li.sfhover ul ul ul {
        left: -999 em;
    }#
    drnav li: hover ul,
    #drnav li li: hover ul,
    #drnav li li li: hover ul,
    #drnav li.sfhover ul,
    #drnav li li.sfhover ul,
    #drnav li li li.sfhover ul {
        left: auto;
    }#
    drnav li: hover,
    #drnav li.sfhover {
        position: static;
    }#
    drnav li li a,
    #drnav li li a: link,
    #drnav li li a: visited {
            background: #BF0100;width: 120 px;color: #FFF;display: block;font: normal 12 px Helvetica,
            sans - serif;margin: 0;padding: 9 px 12 px 10 px 12 px;text - decoration: none;z - index: 9999;border - bottom: 1 px dotted #333;    } # drnav li li a: hover,
            #drnavli li a: active {
                background: #060505;     color: # FFF;display: block;margin: 0;padding: 9 px 12 px 10 px 12 px;text - decoration: none;
            }

Các đoạn CSS có #… là màu của các thành phần trong thanh menu nhé, các bạn có thể tùy chỉnh màu theo ý thích. Bạn có thể thay đổi font chữ tại đoạn code màu xanh.

Cuối cùng lưu template lại, bấm F5 và tận hưởng thành quả. 

Lưu ý: Bạn nên backup toàn bộ code trước khi chỉnh sửa nhé, khi cần có thể phục hồi lại như ban đầu nhé. Và 1 điều nữa là có không vừa ý thì cũng tự hiểu rằng đây chỉ là đoạn code cơ bản để làm menu xổ xuống (Drop down) cho Blogspot thôi ^_^ Bạn phải tùy chỉnh một vài nội dung nữa nó mới hợp với trang web của bạn!

Như vậy, chỉ với vài bước, bạn đã có thể tạo menu xổ xuống trong blogspot của mình, rất đơn giản. Thủ thuật này sẽ giúp bạn bố trí menu gọn gàng, đẹp mắt. Chúc các bạn thành công và có hệ thống menu xổ xuống trong blogspot đẹp

Read more »

Hướng dẫn cách tạo blog cá nhân miễn phí bằng blogspot full

 

Hiện nay blog không còn xa lạ với hầu hết người dùng internet, nó được sử dụng vào rất nhiều mục đích khác nhau như lưu lại những khoảnh khắc hoặc một kỷ niệm nào đó của bản thân, hoặc là nơi chia sẻ những tâm sự của mình, hay dùng để quảng bá thương hiệu, quảng bá cho các sản phẩm của công ty,... Ở Việt Nam, có rất nhiều dạng blog đang được các blogger sử dụng, tuy nhiên một trong những trang web tạo blog miễn phí tốt nhất đang được người dùng ưa chuộng đó là Blogspot. Đây cũng là website cho phép chúng ta tạo blog cá nhân miễn phí hàng đầu thế giới được các chuyên gia khuyên dùng. Ưu điểm khi tạo blog cá nhân sử dụng Blogspot Luôn luôn miễn phí đối với người dùng. Có giao diện miễn phí đa dạng phù hợp với tất nhu cầu sử dụng của các blogger. Cách tạo blog đơn giản nhanh chóng, chỉ cần sử dụng tài khoản Gmail của Google. Dễ dàng tùy chỉnh thêm bớt thông tin, có thay đổi được tất cả các thông tin hiển thị trên blog. Blogspot Google có giao diện thân thiện với thiết bị di động, có thể hiện thị đẹp trên tất cả các loại thiết bị di động. Blog của Google rất thân thiện với các bộ máy tìm kiếm, và có thể dễ dàng đưa website lên top Google. Dễ dàng gán tên miền cho blog mà không mất một khoản phí nào. Video hướng dẫn cách tạo blog chi tiết sử dụng Blogspot Google YouTube Video Cách tạo blog cá nhân trên Google bằng Blogspot Có nhiều bạn gửi mail cho mình hỏi làm thế nào để tạo blogspot cá nhân giống như của Đỗ Bảo Nam Blog? Công việc này không khó, tuy nhiên nếu muốn có được một blog đẹp thì bạn cần tìm một mẫu giao diện theo ý muốn với đầy đủ các tính năng mà mình cần. Các bạn có thể tạo blog các nhân theo các bước hướng dẫn dưới đây: Bước 1: Đăng ký Gmail để tạo blog Google Để tạo được blog cá nhân sử dụng Blogspot của Google, trước hết các bạn cần có một tài khoản Gmail. Nếu trong trường hợp các bạn đã có tài khoản này thì các bạn có thể bỏ qua bước đăng ký và tiến hành các bước tiếp theo. Nếu bạn nào chưa biết cách tạo tài khoản Gmail, các bạn có thể xem hướng dẫn dưới đây: Bước 02: Lập blog Google Sau khi các bạn đã có tải khoản Google, các bạn truy cập vào website blogger.com hoặcblogspot.com để tạo blog. Khi truy cập vào một trong hai trang web trên, Google sẽ chuyển hướng đến trang đăng nhập tài khoản nếu như bạn chưa đăng nhập và bạn cần đăng nhập để tạo blog, nếu các bạn đã đăng nhập tài khoản thì Google sẽ chuyển hướng đến trang tổng quan Blog. Tại trang tổng quan Blogger ở trên, nếu giao diện website của bạn đang hiển thị tiếng Anh và bạn đang muốn chuyển sang tiếng Việt, các bạn có thể click vào ngôn ngữ ở góc trên bên phải của trang web theo như hình vẽ. Và để tạo blog Google, các bạn chỉ cần click vào Blog mới như hình trên, sau đó một cửa sổ mới hiện ra các bạn điền đầy đủ thông tin theo hình bên dưới. Sau khi đã điền đầy đủ các thông tin như tiêu đề blog, địa chỉ, mẫu blog, các bạn chỉ cần nhấp chuột trái vào nút "Tạo blog" để hoàn tất. Các bạn lưu ý, khi các bạn nhập dòng tiêu đề thì tại dòng địa chỉ, Google sẽ tự động lấy tên theo tiêu đề. Tuy nhiên các bạn cũng có thể thay đổi lại tiêu đề ở dưới tùy theo ý muốn. Trong nhiều trường hợp, nếu địa chỉ blog mà bạn muốn tạo đã trùng với một địa chỉ nào đó, bạn cần phải chọn một địa chỉ khác không trùng với bất kỳ ai. Sau khi click vào "Tạo blog", Google sẽ lại chuyển hướng về trang tổng quan Blogger, trong đó chứa blog vừa tạo như hình dưới đây: Việc tiếp theo các bạn cần làm đó là viết bài cho blog. Để viết bài cho blog, các bạn có thể click vào link "Bắt đầu đăng bài" hoặc click vào nút màu vàng như trong hình ở trên, hoặc các bạn có thể click vào tên blog vừa tạo, sau đó click vào nút "Bài đăng mới". Khi đó Google sẽ chuyển hướng các bạn đến một trang mới để viết bài như hình dưới đây, các bạn có thể viết blog theo các bước như trong hình. Ở phần cài đặt bài đăng ở trên, các bạn nên nhập nhãn cho bài viết để phân loại bài viết theo chuyên mục. Ngoài ra, các bạn có thể chỉnh lại liên kết cố định để được url theo ý muốn của mình. Và cứ như vậy, mỗi một lần viết bài cho blog các bạn lại lặp lại theo tác như ở trên. Sau khi viết bài xong, các bạn có thể click vào nút "Xem blog" như ở hình trên, hoặc nhập trực tiếp địa chỉ blog mà bạn đã tạo để truy cập vào blog của mình. Hướng dẫn cách thay đổi giao diện Blogspot Nếu như các bạn muốn để giao diện đơn giản mặc định của Blogspot, các bạn có thể bỏ qua bước thay đổi giao diện. Tuy nhiên, hầu hết blogger đều thay đổi giao diện của Blogspot để được một website đẹp hơn và có các tính năng cần thiết theo ý muốn. Để thay đổi giao diện cho Blogspot, trước hết các bạn cần có một giao diện sẵn dưới dạng file .xml, sau đó các bạn chỉ cần tải file .xml lên để thay đổi giao diện Blogspot. Các bước làm các bạn thực hiện như sau: Bước 01: Tìm giao diện cho Blogspot Tùy theo mục đích các bạn tạo blog để chọn giao diện cho phù hợp. Nếu các bạn viết blog để bán hàng và quảng bá sản phẩm, các bạn có thể tìm những mẫu giao diện blog bán hàng. Nếu các bạn viết blog dạng tin tức, các bạn có thể chọn những mẫu giao diện dạng tin tức để có được một bố cục website đẹp mắt. Nếu các bạn viết blog theo một lĩnh vực nào đó, các bạn có thể chọn template blog theo lĩnh vực đó... Để tìm được các giao diện Blogspot theo ý muốn các bạn hãy lên Google tìm kiếm và tải về. Ví dụ các bạn có thể tìm với từ khóa "giao diện blogspot bán hàng" hoặc "template blogspot ecommerce"... để tìm ra những mẫu giao diện cho blog bán hàng. Hay các bạn có thể tìm trên Google với cụm từ "template blogspot tin tức"; "template blogspot news"... để tìm kiếm giao diện dành cho blog về tin tức... Sau khi các bạn đã tìm được một mẫu giao diện Blogspot ưng ý, các bạn hãy tải mẫu đó về. Thông thường khi tải về các bạn sẽ được một file nén, các bạn hãy giải nén ra để được một file .xml. Tiếp đến ở trang quản trị của blog, các bạn click vào "Mẫu", sau đó click vào "Sao lưu/khôi phục" như hình dưới đây: Sau khi click vào nút "Sao lưu/khôi phục" ở trên, một cửa sổ mới hiện ra các bạn hãy tải mẫu giao diện mới lên để thay đổi giao diện cho blogspot. Sau khi đã thay đổi giao diện thành công cho blog, các bạn có thể vào "Bố cục" và tùy chỉnh bố cục cho blog. Tùy theo mỗi mẫu giao diện khác nhau mà các bạn có những bố cục khác nhau.  Các bạn có thể thêm các tiện ích, hoặc xóa các tiện ích tùy theo ý muốn của mình. Hướng dẫn cách seo cho Blogspot Sau khi các bạn đã tạo blog, các bạn có thể seo blog của mình để người khác có thể dễ dàng tìm đến các bài viết của mình. Công việc này đối với các bạn làm seo thì gần như ai cũng biết, tuy nhiên với những ai chưa biết nhiều về seo hoặc chưa hiểu seo để làm gì thì công việc này sẽ còn rất mơ hồ. Để người dùng có thể dễ dàng tìm đến các bài đăng của bạn trên Google, các bạn cần tối ưu nhiều thứ theo chuẩn, trong đó một số vấn đề sau các bạn cần quan tâm: Tối ưu nội dung cho Blogspot Việc tối ưu nội dung là vấn đề được ưu tiên hàng đầu trong việc làm seo. Đối với seo cho Blogspot cũng vậy, mỗi bài viết của các bạn cần hướng tới người dùng, các bạn nên viết những bài viết thật hữu ích cho người dùng. Một điều lưu ý rằng, các bạn đừng nên copy y nguyên nội dung từ website khác về blog của mình. Nếu Google phát hiện bạn đi copy nội dung từ website khác, bài viết của bạn thường sẽ rất khó để đạt kết quả cao trên công cụ tìm kiếm Google, nếu nặng hơn bạn có thể bị Google xóa blog bất kỳ lúc nào. Khi viết nội dung cho Blogspot, các bạn cũng để ý các đề mục lớn các bạn có thể bôi đậm giống như trong bài hướng dẫn cách tạo blog này, hoặc chọn tiêu đề cho nó bằng cách bôi đen một đoạn văn bản, sau đó chọn tiêu đề như hình dưới đây. Một điểm nữa khi các bạn tối ưu hóa nội dung cho blogspot, các bạn cũng cần tối ưu cho các hình ảnh tải lên trong blog. Tên hình ảnh các bạn đặt có ý nghĩa, (ví dụ như cach-tao-blog-google.jpg), tất cả các hình ảnh các bạn điền đầy đủ các thuộc tính cần thiết để nội dung blog được thân thiện với công cụ tìm kiếm Google cũng như tất cả các công cụ tìm kiếm khác. Tối ưu nhãn, url, mô tả cho bài đăng Việc tối ưu các yếu tố này cũng khá quan trong trong seo. Nhìn vào hình ở trên, các bạn có thể thấy được các thông tin mình đã tối ưu cho bài viết. Các bạn có thể tham khảo thông tin như ở trên. Tuy nhiên nếu để mặc định, tất cả các bài đăng mới của các bạn sẽ không có phần mô tả như ở trên. Vậy làm thế nào để viết mô tả cho mỗi bài đăng khi viết blog? Các bạn cần làm như sau: Bước 01: Click Cài đặt Bước 02: Click Tùy chọn tìm kiếm Bước 03: Click vào Chỉnh sửa, chọn Có và nhập mô tả của Blog Bước 04: Nhấp vào Lưu thay đổi để lưu lại thông tin. Sau khi thực hiện các thao tác ở trên, ở mỗi bài đăng của bạn sẽ có thêm phần mô tả tìm kiếm ở phần cài đặt bài đăng. Các bạn nên nhập mô tả tìm kiếm cho bài viết khoảng 140-154 ký tự, và phần mô tả này nên mô tả tổng quan cho bài viết của bạn. Tối ưu file robots.txt cho blogger cho seo Việc tối ưu file robots.txt này cũng khá quan trọng, tuy nhiên nếu các bạn không am hiểu về file này, các bạn có thể bỏ qua. Nếu các bạn muốn tùy chỉnh file robots.txt này, các bạn có thể copy đoạn mã sau và dán vào blog như hình dưới đây: Nội dung file robots.txt:  User-agent: Mediapartners-Google Disallow: User-agent: * Allow: / Disallow: /*?updated-max=* Disallow: *archive.html Sitemap: http://dobaonam.blogspot.com/sitemap.xml Các bạn lưu ý nhớ thay tên blog dobaonam bằng tên blog của bạn nhé. Để xem hướng dẫn chi tiết hơn về tối ưu file robots.txt cho blogger cho seo và cách tạo sitemap cho Blogspot, các bạn có thể tham khảo hướng dẫn tại: Cách tạo sitemap cho Blogspot Ngoài các bước tối ưu ở trên, nếu bạn nào muốn seo label trong blogspot, các bạn có thể tối ưu nó để khi người dùng tìm kiếm có thể ra website của bạn. Một số mẹo khi tạo blog cá nhân bằng Blogspot Xóa dòng chữ "cung cấp bởi Blogger" Thông thường các blog mới tạo sẽ có dòng chữ "cung cấp bởi Blogger", đó chính là thuộc tính bản quyền của Blogspot. Ở một số giao diện, dòng chữ "cung cấp bởi Blogger" được hiển thị ở những vị trí có thể chấp nhận được. tuy nhiên ở rất nhiều giao diện blog, dòng chữ này hiển thị tại những vị trí quan trọng làm mất tính thẩm mĩ của blog. Vì vậy, để làm blog đẹp hơn các bạn nên xóa dòng chữ này đi. Thông thường với các tiện ích được thêm vào blog, các bạn có thể dễ dàng xóa bỏ đi bằng cách click vào Chỉnh sửa tiện ích, sau đó nhấp vào nút xóa. Tuy nhiên đối với tiện ích "cung cấp Bởi blogger", các bạn sẽ không nhìn thấy nút Xóa ở chỗ nào. Vậy làm thế nào để xóa được dòng chữ bản quyền của Blogspot này? Để làm được điều này các bạn thực hiện theo các bước sau: - Bạn vào phần mẫu –> Click chỉnh sửa HTML –> Nhấn Ctrl + F - Nhấn từ tìm kiếm: Attribution để tìm đến dòng <b:widget id=’Attribution1' locked=’true‘ title=” type=’Attribution’> - Sau đó thay phần locked=’true’ thành locked=’false‘ và lưu lại. - Sau đó các bạn có thể quay lại trang chủ của blog hoặc trang Bố cục trong quản trị để xóa tiện ích này ra khỏi blog mà bạn đã tạo. Chia sẻ theme Blogspot Đỗ Bảo Nam Blog Với mục đích chia sẻ tới tất cả các bạn, mình xin gửi tới các bạn mẫu giao diện blgospot mà mình đã có. Nếu các bạn thích mẫu theme Blogspot này của mình, các bạn có thể tải về ở phần download ngay dưới đây. Trong quá trình làm blog nếu có gì thắc mắc, các bạn có thể comment ở phía dưới để mình hoặc các bạn xem blog có thể giải đáp sớm nhất.  Download theme Blogspot Như vậy ở trên đây Đỗ Bảo Nam Blog đã hướng dẫn khá chi tiết về cách tạo blog cá nhân miễn phí của Google, hy vọng với bài hướng dẫn này các bạn có thể tự lập blog và tùy chỉnh blog sao cho được đẹp nhất, và có thứ hạng cao trên các công cụ tìm kiếm. Chúc các bạn thành công! Tham khảo: http://caocongkien.blogspot.com/2013/10/tao-menu-ngang-ep-cho-blogspot.html Nguồn: http://dobaonam.blogspot.com/2015/05/huong-dan-cach-tao-blog-google.html

Read more »

Cách Tạo Blog, Chỉnh Sửa Thanh Menu Tạo Blog Đẹp

16:37  UNKNOWN  10 COMMENTS

Cách Tạo Blog  Tạo Web Bán Hàng Miễn Phí thay đổi giao diện Template cho blog mình đẫ chia sẻ ở những bài trước, phần tiếp theo mình sẽ hướng dẫn các bạn chỉnh sửa thanh Menu có nhiều danh mục được sổ ra rất đẹp. Nếu như bạn chưa học về mã nguồn HTML để thay đổi hay tạo thêm menu theo ý muốn và nó phải phù hợp với nội dung của blog chắc chắn bạn sẽ gặp khó khăn thậm trí không tự đổi được nhưng không sao bây giờ các bạn cứ làm theo hướng dẫn của mình từng bước là ok .

Cách Chỉnh Sửa Thanh Menu Trong Blog

Chỉnh sủa thanh menu trong blog (1)

- Các bạn truy cập vào Blog của mình rồi xem lại mẫu (giao diện) gốc sẽ có hình như trên toàn bộ thanh menu đều là tiếng anh vậy làm sao để thay nó thành tiếng việt theo ý bạn , các bạn làm như sau

- Vào trang quản lý của blog như hình dưới ==> chọn mẫu ==> chọn chỉnh sửa html

Chỉnh sủa thanh menu trong blog (2)

** Lưu ý : trước khi tiến hành chỉnh sửa HTML các bạn cần thận trọng từng bước không lên thay đổi chỉnh sửa các ký tự trong mã nguồn html nếu bạn không được hướng dẫn hãy làm từng bước một sau mỗi bước ta phải lưu mẫu lại để kiểm tra ( tránh tình trạng bị nỗi mã nguồn)

Tiếp theo các bạn làm như sau ;

Hướng dẫn chỉnh sửa thanh menu có sẵn trong Teamplate

- Bạn nhấp chuột vào ô chứa mã nguồn code 

- Nhấn tổ hợp phím Ctrl + f  sau đó thanh tìm kiếm ( Search) hiện ra trên góc phải ô mã nguồn ( xem hình bên dưới)

Gõ chữ home rồi nhấn Enter kết quả sẽ hiện thị đoạn code có chứa từ các bạn cần tìm là home, tiếp theo các bạn chỉ cần điền những từ theo ý muốn của mình vào những dòng chữ màu đen sẽ hiển thị trên thanh menu là được.

CÁCH CHỈNH SỦA THANH MENU BLOG (3)

Ví dụ :

 lúc đầu thanh menu sẽ có những menu  là:

 ( HOME       DOWNLOADS         PARELT CATEGORY         FEATURED          HEALTH )

Mình sẽ thay bằng những cái tên cho menu và danh mục con sổ ra theo nội dung bài viết hay sản phẩm dịch vụ của mình cần giới thiệu để người đọc rễ tìm kiếm những bài viết khác sẽ giúp cho người đọc ở lại blog của chúng ta nâu hơn đem lại nhiều thông tin cho khách hàng như vậy tỷ lệ chuyển đổi mua hàng cao hơn nếu bạn là người bán hàng , mình sẽ thay thành

( TRANG CHỦ       GIỚI THIỆU       TIN TỨC       LIÊN HỆ        GIÁ VÉ  )

Hướng dẫn chỉnh sửa menu  blog 

- Khi tải mẫu Teamplate có rất nhiều mẫu khác nhau để các bạn lựa chọn tuy nhiên các bạn cần lưu ý những tính năng và thanh menu được tích hợp sẵn trong từng mẫu là hoàn toàn khác nhau có thể có hoặc không,các bạn lên chọn những Teamplate có sẵn menu thì chúng ta chỉ việc thay vào đó bằng tiếng việt là được còn nếu bạn nỡ tải mẫu không có thanh menu hoặc có ít menu con thì bạn có thể tiến hành các bước như sau để tạo thêm menu .

Hướng dẫn  tạo thêm menu hàng dọc ở phía trên cùng 

Bước 1 ; bạn vào chỉnh sủa html  rồi dán đoạn code sau vào bên dưới cặp thẻ <body>
            

                       <li><a href='#'>tên MENU</a></li>
                       <li><a href='#'>tên MENU</a></li> 

sau đó bạn thay tên menu của mình muốn tạo vào chữ được bôi màu đỏ >tên MENU<  cuối cùng các bạn chọn lưu mẫu và  chọn xem blog để kiểm tra kết quả như hình bên dưới .

Hướng dẫn  tạo thêm menu hàng dọc ở phía trên cùng 

Hướng dẫn tạo thêm menu, chỉnh sửa menu ngang

 Giao diện các bạn mới tạo hoặc sử dung nâu rồi nhưng bây giờ bạn muốn thêm nội dung mới danh mục mới vào blog thì các bạn có thể thêm menu để khách hàng rễ dàng phân loại hay tìm kiếm nội dung cần xem . Để tạo thêm menu mới trong thanh menu ngang các bạn làm như sau

- các bạn vào lại mẫu chon chỉnh sửa html ==> nhấp chuột trái vào ô mã nguồn ==> nhấn tổ hợp các phím Ctrl + f  ==> nhập từ trang chủ vào ô Search kéo xuống đoạn code mà ta muốn thêm menu mới vào 
Vídụ tôi muốn thêm menu mới vào bên cạnh Trang Chủ thì các bạn dán đoạn code sau vào bên cạnh code menu trang chủ

<li><a href='#'>MENU mới</a>

code menu đơn không có menu con sổ xuống

<li><a href='#'>MENU mới </a>
<ul class='children'>
<li><a href='#'>Menu con</a></li>
<li><a href='#'>menu con</a></li>
<li><a href='#'>menu con</a></li>
<li><a href='#'>menu con</a></li>
</ul>

</li>

code menu có menu con sổ xuống

Hướng dẫn chỉnh sửa menu  blog

Tương tự các bạn muốn tạo thêm menu mới bên cạnh menu nào thì các bạn dán đoạn code bên trên vào nhé
- trong trường hợp các bạn chưa có bài viết chèn vào menu con thì các bạn có thể không cho menu con đó hiển thị khi ta nhấp chuột vào bằng cách xóa đi dòng chữ Menu con
- Còn muốn  thêm menu con sổ ra dài hơn thì bạn copy đoạn code bên dưới

   <li><a href='#'>thêm menu con</a></li>

dán vào bên trên cặp thẻ   </ul>
                                          </li>
                                  

Ví dụ :  tôi dán thêm vào đoạn code menu trên 3 menu con thì tôi dán thêm vào đoạn code màu đỏ

<li><a href='#'>MENU mới </a>

<ul class='children'>

<li><a href='#'>Menu con</a></li>

<li><a href='#'>menu con</a></li>

<li><a href='#'>menu con</a></li>

<li><a href='#'>menu con</a></li>

<li><a href='#'>thêm menu con</a></li>

<li><a href='#'>thêm menu con</a></li>

<li><a href='#'>thêm menu con</a></li>

</ul>

</li>

ngược lại bạn muốn xóa bớt menu con đi thì bạn xóa đoạn code đó đi sau đó chọn lưu mẫu và kiểm tra là được

Như vậy ở bài viết này mình đã chia sẻ với các bạn cách chỉnh sửa thanh menu và thêm mới menu có thể còn thiếu sót vì mình không phải là người lập trình web hay IT mà đơn giản tất cả những thứ mình chia sẻ chỉ là do mình tự mày mò ở trên mạng sau đó tự học tự làm rồi rút ra kinh nghiệm để chia sẻ cho các bạn, với những kiến thức này mình có thể tự tạo cho mình những blog cá nhân như blog các bạn đang xem blog Việt nguyễn. hy vọng với những kiến thức cơ bản này sẽ có ích cho các bạn chúc các bạn thành công

Read more »