Xinh Xinh Việt Nam

Trong khi thiết kế, chỉnh sửa giao diện, viết nội dung Blog, nếu bạn muốn khống chế khu vực mà đoạn văn bản có thể được hiển thị, đơn giản bạn chỉ cần giới hạn số dòng mà đoạn văn bản có thể hiển thị bằng cách sử dụng CSS. Xem code ví dụ: .max-lines{    overflow: hidden;    text-overflow: ellipsis;    display: -webkit-box;    -webkit-box-orient: vertical;    -webkit-line-clamp: N; /*số dòng muốn hiện */    font-size: F;          /*cỡ chữ, đơn vị px */    line-height: X;        /* khoảng cách giữa các dòng, đơn vị em*/    max-height: F*N*X;   /* chiều cao tối đa đoạn văn bản = (cỡ chữ) x (số dòng) x (chiều cao) */ } Cách sử dụng Khi muốn sử dụng, bạn thêm class "max-lines" cho đoạn văn bản đó, có thể xem DEMO Áp dụng Bạn có thể áp dụng cách này để khống chế, giới hạn số dòng của tiêu đề bài viết trên trang chủ để không làm vỡ Layout, bạn chỉ cần chỉnh sửa CSS tương tự bên dưới là được: h2.post-title, h2.post-title a {     font-size: 20px;     line-height: 1.3em;     color: #3

Sitemap (sơ đồ) một từ ngữ không quá xa lạ. Nhưng các bạn phải phân biết cho rõ nhé Sitemap mà các bạn gửi lên Google webmasters hay Bing webmaster … Các Sơ đồ đó có nhiệm vụ "khai báo" với các công cụ tìm kiếm những thông tin chứa trong đó. Như vậy, sẽ giúp cho blog SEO (tối ưu tìm kiếm) tốt hơn. Khi các công cụ tìm kiếm "quét" qua Blog, tiêu điểm sẽ là sơ đồ blog. Còn Sitemap (sơ đồ) mà mình hướng ngày sau đây nó giúp cho người đọc có một cái nhìn tổng thể về trang Blog đang truy cập... Nhờ có sơ đồ, người đọc dễ dàng tìm đến các chuyên mục và bài viết chứa những thông tin cần tìm kiếm. Tóm tại Sitemap (sơ đồ) là một tiện vô cùng quan trọng là một giải pháp vời của một Blogger … Nó không khác gì một cuốn sách có MỤC LỤC, MỤC LỤC sẽ nói lên toàn bộ nội dùng của cuốn sách đó, người sẽ quyết định có ĐỌC hay là KHÔNG ĐỌC. Vậy việc tạo 1 Sitemap (sơ đồ) chuyện nghiệp là một điều vô cùng quan trọng và hôm nay Niệm Style sẽ giúp bạn là đều đó @! Ở bài viết này Niệm Sty

Bài viết này mình sẽ giới thiệu đến các bạn mẫu button với hiệu ứng hover tuyệt đẹp và tinh tế , sử dụng hoàn toàn CSS để tạo ra hiệu ứng. Button này mình tham khảo ở một trang nước ngoài, chỉnh sửa lại một số CSS và chia sẻ lại cho các bạn. Button này hoàn toàn bằng CSS nên mọi người cứ yên tâm không ảnh hưởng chút nào đến tốc độ load blog của các bạn. Các bước thực hiện như sau: Bước 1 : Các bạn thêm đoạn CSS sau lên thẻ  ]]></b:skin> /* button */ .bttn-success {   color: #28b78d; } .bttn, .bttn-lg, .bttn-md, .bttn-sm, .bttn-xs {   margin: 0;   padding: 0;   border-width: 0;   border-color: transparent;   background: transparent;   font-weight: 400;   cursor: pointer;   position: relative; } .bttn-md {   font-size: 20px;   font-family: inherit;   padding: 5px 22px; } .bttn-unite {   margin: 0;   padding: 0;   border-width: 0;   border-color: transparent;   background: transparent;   font-weight: 400;   cursor: pointer;   position: relative;   font-size: 20px;   font-family:

Đây là một thủ thuật khá đơn giản giúp bạn hiển thị một thông báo khi bạn xóa một comment nào đó từ người comment trên blog bạn. Nó giúp cho bạn truyền đạt được nội dung cũng như lý do mà bạn xóa comment đó. Nó cũng góp phần làm cho blog của bạn thêm chuyên nghiệp hơn! Thực hiện: Các bạn copy đoạn code sau và dán trên thẻ  ]]></b:skin> .comments .deleted-comment:after{content:" Vui lòng đọc lại nội quy bình luận tại: https://niemstyle.blogspot.com/p/noi-quy-binh-luan.html nhé"} .comments .deleted-comment:before{content:"\f00d";font-family:fontawesome;margin:0 6px 0 0} Các bạn chỉnh sửa lại nội dung CSS theo ý thích của mình là được. Lưu template lại và thưởng thức thành quả. Các bạn lưu ý một điều như thế này: Khi các bạn xóa comment đừng nên xóa vĩnh viễn nha, xóa thông thường thôi, ko là nó sẽ ko hiện thông báo lên đâu. Chúc các bạn thành công! đừng quên để lại 1 comment để ủng hộ tác giả nhé! Theme blogspot chia sẻ bởi : Share123 Blogger Templates D

Note: bài cũ up lên! Hầu như các blogger hiện nay đều sử dụng widget nhận xét mới trên blog của mình. Chức năng của nó là hiện thị các bình luận gần nhất của độc giả, giúp tăng tính tương tác cũng như là thẫm mĩ cho blog. Cách thực hiện rất đơn giản: Các bạn vào Blog > Bố Cục > Chọn HTML/Javascript và dán toàn bộ code sau vào: <style> .nxmoi{color: #ccc;} .nxmoi li{margin:0;padding:10px;border-left: 2px solid #ccc;} .nxmoi li:before {content: "";width: 12px;height: 12px;display: block;border: 3px solid #ccc;border-radius: 50%;float: left;left:-5px;position: absolute;background: #fff;} .nxmoi li:hover:before{background:#F48FB1} .nxmoi span a{color:#F48FB1;font-weight:600;transition: color .3s;} .nxmoi span a:hover{color:#F48FB1;transition: color .3s;} .nxmoi span {color:#fff} </style> <script>//<![CDATA[ var sl_nhanxet = 5,     kt_nhanxet = 50; // Recent Comment function nhanxetmoi(json) {     var entry, commurl, commsum;     document.write('

Xin chào các bạn hôm nay mình xin phép được chia sẻ một kinh nghiệm nho nhỏ của mình trong lĩnh vực SEO , đó là: đẩy một từ khóa chính của site lên top của google tìm kiếm . Rất ít người biết rằng google sites lại là một công cụ tuyệt vời để tạo nguồn backlink thân thiện mà không lo đến vấn đề spam. Cách SEO từ khóa với Google Site 1, Tạo một website bằng Google Site , đăng một vài bài viết đơn giản, chủ yếu là chèn ẩn cho text trỏ về site chính với các keywork phụ liên quan đến từ khóa chính. 2, Submit link google site vừa tạo lên một vài site có độ trust với google cùng lượng index, visit cao – Xem bài này . 3, Đừng quên chạy qua Pingler.com để ping RSS. 4, Đợi một vài tiếng đến gần 3 ngày để google index site mới và index luôn site chính của mình. Tham khảo web google site của mình: tại đây Lời kết Cuối cùng là kiểm tra thành quả thông qua google webmaster và tận hưởng thôi. Ở đây có nghĩa là chúng ta lợi dụng google site để làm một từ khóa trỏ về blogspot của mình hay websi

Hôm nay, mình sẽ nói về một vấn đề mà rất nhiều người ít chú ý đến trong việc xây dựng link của blog đó là SEO hình ảnh. Tất cả mọi khía cạnh của SEO đều mang đến tác hại khi bị lạm dụng và SEO hình ảnh chính là một ví dụ điển hình! Mình sẽ phân tích như sau: Hình ảnh là nơi rất nhiều người spam các từ khóa vô tội vạ trong thẻ Alt để lừa gạt hệ thống của Google và mang về thứ hạng cao hơn. Dù việc spam từ khóa trong Alt hình ảnh đã không còn được áp dụng, nhưng đôi lúc người ta vẫn cho rằng link hình ảnh là xấu. Một vấn đề khác liên quan đến sai lầm này trong việc xây dựng liên kết chính là khả năng đọc hình ảnh của các trình thu thập thông tin . Vài năm trước đây, Google bot không thể đọc được thuộc tính alt từ một hình ảnh để phân tích cú pháp cho dù nó dễ hiểu hơn việc đọc hiểu văn bản HTML. Vì vậy, Google’s Guildelines (Hướng dẫn từ Google) đã nói rằng: “Hãy sử dụng văn bản (text) thay vì hình ảnh (image) để hiển thị các nội dung quan trọng như Tên, Nội dung hoặc Liên kết. Nếu bạn

Ngày nay Google dùng các thuật toán để xác định hàng trăm các yếu tố khác nhau nhằm mục đích xếp hạng website của chúng ta trên công cụ tìm kiếm của họ. Đối với các SEOer thì việc tìm hiểu các yếu tố xếp hạng là vấn đề nên làm thường xuyên. Và hiện tại bài viết này mình sẽ chia sẻ với các bạn 5 yếu tố xếp hạng Google mà mình cảm thấy cần lưu ý nhất trong thời gian hiện tại. 1. Link Building không còn quan trọng như trước nữa Link building trước giờ vẫn là một vấn đề nan giải nhất đối với các SEOer. Hiện tại thì theo cảm nhận thì nó không còn quá ảnh hưởng đến thứ hạng từ khóa như trước đây nữa, đặc biệt là đối với những bạn nào đi rải backlink, mua backlink khắp nơi mà chã chịu đầu tư vào chất lượng nội dung bài viết của mình. Nếu các bạn có biết qua ông John Mueller , một nhân viên của Google có đề cập là, mục tiêu chính của chúng ta bây giờ nên là tạo ra những nội dung thật tốt và có giá trị cho người đọc để chia sẻ thay vì đi xây dựng liên kết (Link Building) vì hiện tại xây dựng

Để thêm phần nổi bật cho đoạn văn nào đó hay một chú ý thì bạn cần thêm vào đoạn văn bản được làm nổi bật lên để mọi người chú ý đến nó hơn. Code info hay note cho blogger 1. Vào bảng điều khiển Blogger 2. Đến "Mẫu" >> "Chỉnh Sửa HTML" 3. Tìm đến đoạn  ]]></b:skin>  và thêm đoạn code dưới vào trên thẻ vừa tìm được .info {     background: #F8E38D url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghawEACzLHpJLIXGjFzNEYr0tmXjf4DcFl7bEJXXzaG17IFBnoCl_EwBmgdJw27roiNMrNEsRDc_TdHugF-8KILi9MJ4R3gU1Nor7zczs7Ghaxkc-eEF9NQAHlYzyP-0-Qym-oV6drRy0/s1600/info.png) no-repeat 12px 8px;     color: #222;     line-height: 22px;     min-height: 38px;     padding: 10px 12px 12px 68px;     margin: 5px 0; } Khi sử dụng trong bài viết bạn sử dụng đoạn code sau: <div class="info">Đoạn văn muốn nổi bật</div> Demo: Chào mừng các bạn đến với Niemstyle.com | Niemstyle.com là blog chuyên viết về các thủ thuật internet, facebok, blogger, softwar

Chào các bạn, hôm nay Niemstyle.com  lại tiếp tục chia sẻ đến các bạn một mẫu template blogspot bán hàng thông minh với mã nguồn Blogger. Template này có tên là Super Store được bán với nhiều mức giá khác nhau trên thị trường, nay được Niemstyle  chia sẻ miễn phí. Một số thông tin Template này có giao diện thiết kế blogspot đẹp chuẩn seo phù hợp các mặt hàng như mỹ phẩm, thời trang, giày dép Bố cục thiết kế gọn gàng người dùng dễ quản lý, một mẫu blogspot bán hàng khá đẹp các bạn không nên bỏ qua. Mẫu có độ responsive chuẩn làm web blogspot bán hàng, web blogspot vệ tinh đẹp. Các tính năng nổi bật Giao diện sáng, đẹp, tùy biến dễ dàng, Slide trình chiếu ảnh sản phẩm đẹp mắt, hiển thị sản phẩm trên trang chủ theo từng chuyên mục riêng Menu ngang kết hợp dạng dropdown với nhiều cột thư mục được trình bày hợp lý Giao diện thân thiện với mọi thiết bị di động (Responsive) như Destop, Ipad, Smart phone... Tích hợp "THÊM VÀO GIỎ", "MUA NGAY" và nhận ngay đơn hàng qua mail

Hôm nay, Niemstyle.com  chia sẻ một template blogspot bán hàng tuyệt đẹp nữa. Đây là mẫu thiết kế template blogspot thời trang Fashion Shop chuyên về thời trang nam như áo vết, dây nịt, giày nam cực kỳ chuyên nghiệp. Tính năng nổi bật Responsite full Slider ảnh Facebook fanpage box Giỏ Hàng Menu stick Tin tức SEO Footer 4 cột Xem Demo và Download Template Live Preview Download   (Get link) Một template blogspot bán hàng quá tuyệt vời ông mặt trời rồi đúng không các bạn, hy vọng các bạn sẽ thích mẫu giao diện blogspot bán hàng chuyên nghiệp đẹp và chuẩn seo này nhé.! Theme blogspot chia sẻ bởi : Share123 Blogger Templates Design Blog Hồng Tham gia cộng đồng Blogspot Việt Nam Cộng đồng Blogspot Việt Nam

Material Design là một ngôn ngữ lập trình trực quan được tạo ra bởi Google . Nó là lập trình ngôn ngữ sử dụng hiển thị trực quan một cách thú vị nhưng vô cùng đơn giản. Hôm nay Niemstyle.com chia sẻ đến các bạn một mẫu Menu Material Design Responsive đơn giản chỉ với HTML và CSS cực nhẹ. Một vài hình ảnh Demo Create Responsive Navigation Nenu Đây là HTML <div id='main'>   <div class='container'>     <div  style='margin-top:150px;margin-bottom:30px;text-align:center;'>       <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiral7STgHRJOd8IdZu1KW8mvsD6bdf3FZ83-G_C5w9Tle2MffQI7PsH9JYbWx6ror7vIZguJXTc_Lxn-BzDcFbPzEFYgnwH2LDLzJtVNesrhAgTNf3g8Ot42bs7oC2wTKIC81in774p-RC/s320/logo.png' style='width: 100px;margin-bottom:15px'>       <h1>Material Design Responsive Menu</h1>     </div>     <nav>       <div class='nav-fostrap'>         <ul>           <li><a href

Chào các bạn, hôm nay mình sẻ đến các bạn code của nút call và phone number cực đỉnh hoàn toàn bằng css , rất thích hợp để sử dụng ở các blog, trang web bán hàng hoặc làm dịch vụ... Chia sẻ thật với các bạn là code này mình lấy bên blog của anh Huỳnh Phụng (toilaquantri.com) nhưng không thấy anh ấy sử dụng nữa nên mình đem share cho các bạn. Xem Demo Ngay Các bạn sử dụng như sau: Coppy toàn bộ code phía dưới và dán lên trên thẻ đóng /body Sau đó sửa thông tin số điện thoại của mình lại là được rồi. <div class='hotline'> <div class='phonering-alo-phone phonering-alo-green phonering-alo-show' id='phonering-alo-phoneIcon'> <div class='phonering-alo-ph-circle'/> <div class='phonering-alo-ph-circle-fill'/> <div class='phonering-alo-ph-img-circle'> <a class='pps-btn-img ' href='tel:0984.541.045' title='Liên hệ'> <img alt='Liên hệ' class='img-responsive' src='htt