Posts

Showing posts with the label Blogger

Thu gọn bài viết, mô tả chi tiết sản phẩm trên web/blog bằng javascrpit

Image
Bạn có nội dung chi tiết quá dài, bạn có một bài viết với số dòng nhiều, bạn muốn hạn chế lại để khi người dung muốn xem thêm thì click xem thêm còn không thì để gọn lại. Làm cho web nhìn gọn gàng, trực quan cho khách truy cập. Thu gọn vài viết, mô tả sản phẩm Bài này sẽ giúp các bạn thu gọn bài viết, mô tả sản phẩm trên web/blog bằng javascrpit Code thu gọn <style> .single_post .post_body {     overflow: hidden;     position: relative;     padding-bottom: 25px; } .single_readmore {     text-align: center;     cursor: pointer;     position: absolute;     z-index: 10;     bottom: 0;     width: 100%;     background: #fff; } .single_readmore:before {     height: 55px;     margin-top: -45px;     content: "";     background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);     background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);     background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,25

Cách Ping sơ đồ trang web/blog sitemap tới Google, Bing

Image
Google và Bing là những công cụ tìm kiếm cho phép bạn gửi sơ đồ trang web của mình qua dịch vụ ping mà không cần đăng nhập vào tài khoản quản trị trang web của bạn nếu bạn không có thời gian để làm điều đó. Bài viết này sẽ hướng dẫn bạn cách thực hiện điều đó. Dự kiến ​​rằng bằng cách ping sơ đồ trang web của bạn tới Google và Bing, robot của các công cụ tìm kiếm đó sẽ thu thập dữ liệu URL của bạn nhanh hơn so với phương pháp thông thường. Cách Ping sơ đồ trang web/blog sitemap tới Google, Bing Cách Ping Sơ đồ trang web/blog tới Google, Bing Để ping sơ đồ trang web của bạn tới Google và Bing, bạn cần lưu hai URL: URL sơ đồ trang web của bạn: https://www.blogtuan.info/sitemap.xml (1) URL RSS của bạn: https://www.blogtuan.info/feeds/posts/default?max-results=500 (2) URL (1) sẽ cần thiết để ping Sitemap tới Google và URL (2) để ping sitemap tới Bing. Tuy nhiên, trước khi bạn tiếp tục ping sơ đồ trang web Blogspot của mình tới Google và Bing bằng phương pháp này, hãy lưu ý rằng: Đừng lạm

Một số nguyên nhân khiến Blog của bạn không được index

Image
Google Core Update vào tháng 7 đến tháng 8 năm 2021, có vẻ như các chương trình của Google "bận rộn" nên nhiều blog (đặc biệt là Blogspot) không được thu thập thông tin và lập chỉ mục; thậm chí, hầu hết thời gian chúng tôi gặp lỗi 5xx khi chúng tôi cố gắng Kiểm tra Trực tiếp URL blog của mình; bằng cách sử dụng các trình kiểm tra URL khác, lỗi 5xx không tồn tại. Sau khi Google Core Update hoàn thành, rất nhiều yêu cầu thu thập dữ liệu sẽ gửi Google Search Console để các bài đăng trên blog của bạn được tìm thấy trong Bị loại trừ , Một số nguyên nhân khiến Blog của bạn không được index Dưới đây là một số nguyên nhân có thể đưa các bài đăng trên blog của bạn vào tab bị loại trừ trong Google Search Console Chuyển hướng trang Nếu bạn bật phiên bản di động của blog, mỗi bài đăng trên blog sẽ có hai phiên bản URL. Phiên bản đầu tiên là phiên bản chuẩn và phiên bản thứ hai là phiên bản di động. URL phiên bản di động của bài đăng trên blog của bạn có tham số bổ sung như url.html?m=1

Hướng dẫn Submit web/blog của bạn lên Bing, Yandex

Image
Bài viết này hướng dẫn cách Submit web/blog của bạn đến Bing, Yandex Webmaster  Yandex và Bing là hai trong số bốn công cụ tìm kiếm lớn nhất (Google, Bing, Yahoo và Yandex) từ Nga. Bing thuộc về Microsoft trong khi Yandex chỉ là công cụ tìm kiếm được nhiều người lướt internet trên thế giới sử dụng. Việc blog của bạn được lập chỉ mục bởi hai công cụ tìm kiếm này giúp bạn có cơ hội có nhiều khách truy cập vào blog của mình hơn. Hướng dẫn Submit web/blog của bạn đến Bing, Yandex Hãy hiểu rằng những gì các công cụ tìm kiếm lập chỉ mục là một URL trang. Nếu bạn có một blog với 100 URL trang (bao gồm các bài viết và các trang), điều đó không nhất thiết có nghĩa là các công cụ tìm kiếm lập chỉ mục tất cả chúng. Nếu bạn thấy URL này đã được lập chỉ mục, điều đó không có nghĩa là tất cả các trang hoặc bài viết trong tên miền đó đều được lập chỉ mục. Các công cụ tìm kiếm có chọn lọc trong việc lập chỉ mục một URL nhất định. Nói cách khác, để được công cụ tìm kiếm lập chỉ mục, URL của bạn phải th

Thêm mô tả cho từng label trong blogspot

Image
Bạn có muốn hiển thị mô tả chuyên mục trên trang web/blog của bạn? Nhãn (chuyên mục) cho phép bạn dễ dàng sắp xếp các nội dung liên quan trên trang web của bạn. Nó cũng giúp người dùng dễ dàng tìm thấy nội dung và giúp ích nhiều cho SEO Đơn giản, bạn muốn thêm vài dòng mô tả cho từng label, khi người dùng tìm kiếm biết rõ mình đang ở đâu, đang tìm kiếm chủ đề gì! Nó sẽ như thế này Thêm mô tả cho từng label trong blogspot Để được tối ưu bạn nên đặt nó ngay dưới Breadcrumb Truy cập vào Blog của bạn chọn Chủ đề > Chỉnh sửa HTML > Tìm kiếm với từ khóa Breadcrumb thêm ngay vào trước nó <b:includable id='label-description' var='posts'>   <b:if cond='data:blog.searchLabel == &quot;url-label&quot;'><p class='label-info'>Viết mô tả</p></b:if> </b:includable> Dùng tương tự với các nhãn khác bằng cách thêm dòng <b:if cond='data:blog.searchLabel == &quot;url-label&quot;'><p class='labe

Follow.it - Giải pháp thay thế Feedburner Google

Image
Google tuyên bố rằng họ sẽ chấm dứt tính năng đăng ký email của Feedburner vào tháng 7 năm 2021. Bạn có thể vào đây để đọc tiếp  Upcoming changes to FeedBurner in July 2021 Người dùng blogger đặc biệt bị ảnh hưởng bởi sự thay đổi này, vì Feedburner cung cấp cho tiện ích đăng ký Blogger (còn được gọi là tiện ích FollowByEmail ). Điều đó có ý nghĩa ? Nếu bạn muốn tiếp tục sử dụng đăng ký email, bạn nên tải xuống dữ liệu người đăng ký email để bạn có thể di chuyển người đăng ký của mình sang dịch vụ đăng ký email mới. Mà mình giới thiệu dưới đây là Follow.it Follow.it là gì? Follow.it cho phép khách truy cập của bạn theo dõi bạn và cho họ một thông báo khi bạn vừa đăng bài viết mới. Nó được sử dụng bởi hơn 100.000 trang web, có đánh giá tuyệt vờivà có thể được sử dụng miễn phí trên gói " Cơ bản " của họ cho phép những người theo dõi không giới hạn. Tương tự như với Feedburner , quá trình này hoàn toàn tự động, vì vậy bạn không gặp bất kỳ rắc rối nào: chỉ cần tiếp tục tập trung

Hướng dẫn tạo POPUP Download có thể dùng tích hợp quảng cáo

Image
Trong bài viết này, mình sẽ hướng dẫn tạo một POPUP gắn link download. Nhấp vào nút, nó sẽ xuất hiện Popup (Modal) và chứa thời gian xác định trước nếu hết thời gian thì nút tải xuống sẽ xuất hiện và bạn đã có thể download vào nó. Tất nhiên là có thể tích hợp thêm Google Adsense vào đấy Hướng dẫn tạo Popup Download Bước 1: Đăng nhập vào tài khoản Blogger.com của bạn  Bước 2: Đi đến chủ đề -> chỉnh sửa HTML  Bước 3:Tìm </head> và đặt mã css bên dưới ngay phía trên mã </head> <b:if cond='data:view.isPost'>   <style> #button-download{display:inline-flex;display:-webkit-inline-flex;flex-wrap:wrap;-webkit-flex-wrap:wrap;align-items:center;-webkit-align-items:center;margin-bottom:10px;padding:9px 20px;border-radius:10px;font-size:.8rem;line-height:1.3rem;background-color:#fdd929;color:#ff2121} .adpop-top{height:40px;width:100%;border-bottom:1px #E5E5E5 solid} .btn-at{display:block;height:50px;color:#fff!important;font-size:18px;text-transform:uppercase;bac

Hướng dẫn phân trang bài viết trên blogspot

Image
Phân trang bài viết thường áp dụng cho blog có xu hướng có các bài đăng dài như blog tin tức, chức năng chia bài viết thành nhiều trang và chỉ hiển thị khi người dùng nhấp vào nút số tiếp theo hoặc tiếp theo. giống như phân trang của blog Đối với những bạn không muốn viết bài viết dài, bài đăng chia tách này sẽ rất hữu ích, ngoài một blog trông gọn gàng hơn cũng có thể cung cấp trải nghiệm đọc tốt hơn. Hướng dẫn phân trang bài viết trên blogspot Truy cập vào Blogger.com -> Chủ đề -> Chỉnh sửa HTML sao chép mã CSS dưới đây đặt trên thẻ đóng ]]></b:skin> .postNav{display:flex;flex-wrap:wrap;justify-content:center; font-size:90%;line-height:20px; color:#fefefe; margin-top:30px;margin-bottom:0} .postNav > *{display:flex;align-items:center; padding:10px 13px;margin-bottom:10px; color:inherit;background-color:#f09800; border-radius:2px;text-decoration:none} .postNav > *:hover{opacity:.8} .postNav .current{background-color:rgba(0,0,0,.03); color:#989b9f} .postNav{font-

Script nhỏ giúp tự động thêm thuộc tính ảnh (thẻ alt) trong Blogspot

Image
Một trong những yếu tố xếp hạng chính là tối ưu hóa hình ảnh thích hợp cho SEO. Nhiều blogger lười biếng để thêm một thẻ alt vào hình ảnh.Vì mình mới có Script nhỏ sẽ tự động thêm thẻ alt trong hình ảnh blog của bạn. Tự động thêm thuộc tính ảnh trong Blogspot Tự động thêm thuộc tính ảnh trong Blogspot Truy cập  Blogger.com  đi đến sửa Chủ đề, tìm và thêm đoạn Script dưới vào trên thẻ đóng </body> <script type='text/javascript'> //<![CDATA[ $(document).ready(function() {   $('img').each(function(){     var $img = $(this);     var filename = $img.attr('src')     $img.attr('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));     $img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));   }); }); //]]> </script> Cái này cơ bản không thể bằng việc thêm alt một cách thủ công được, nhưng cũng giúp được phần nào với tính "

Bắt đầu tạo blog miễn phí trên Blogspot hướng dẫn từ đầu

Image
Hiện nay trên mạng đang có rất nhiều trang web và phần mềm miễn phí hỗ trợ người dùng tạo và phát triển blog cá nhân hoàn toàn miễn phí, trong đó không thể không nhắc đến hai trang web nổi tiếng đó là Blogger vs WordPress . Trong bài viết này, mình sẽ hướng dẫn các bạn các bước tạo một website trên Blogspot (hay còn gọi là Google Blogger) hoàn toàn miễn phí, và thậm chí bạn còn có thể kiếm tiền online trên trang blog của mình mà không cần phải đầu tư gì cả. Blog là gì Blog là gì ? Một trang blog cá nhân sẽ có chức năng tương tự như một cuốn sổ nhật ký online, ở đó bạn có thể thoải mái thường xuyên cập nhật và chia sẻ các thông tin cá nhân của mình đến mọi người, mỗi cập nhật trên blog sẽ được gọi là một bài viết. Các bài viết có thể được dựa trên một chủ đề cụ thể hoặc trên một loạt các chủ đề tùy thuộc vào chủ nhân của trang blog lựa chọn. Các bài đăng mới nhất trên blog sẽ xuất hiện ở trang đầu tiên của blog và được xuất hiện theo thứ tự thời gian từ mới đến cũ. Tại sao nên chọn viế

Tự động đánh liên kết nguồn khi copy trên web/blog

Image
Thực tế rất dễ dàng để sao chép văn bản từ một trang web và dán nó vào một trang web khác. Về mặt kỹ thuật, nếu một khách truy cập blog sao chép văn bản từ một trang web cụ thể, bạn sẽ phải cung cấp một liên kết đến nguồn gốc của trang web mà bạn đã sao chép văn bản. Nhưng cũng có những người bỏ qua điều quan trọng này. Để tránh điều đó, ở đây tôi sẽ cung cấp cho bạn một mã Javascrpit tự động nếu ai đó sao chép một đoạn văn bản từ bài viết của bạn, nó sẽ tự động hiển thị liên kết nguồn của văn bản mà nó sao chép. Mặc dù bằng cách này mình nghĩ rằng vẫn còn kém hiệu quả bởi vì các liên kết nguồn có thể được gỡ bỏ một cách dễ dàng và những lời khuyên này là một cách cũ mà vẫn có thể được sử dụng , nhưng ít nhất sẽ đưa ra một cảnh báo nhỏ cho những người sao chép các văn bản của bài viết blog của bạn. Dưới đây là cách tự động thêm liên kết nguồn. Tự động đánh liên kết nguồn khi copy trên web/blog Tự động đánh liên kết nguồn khi copy trên web/blog Đoạn mã hoạt động trong một số trình duyệt

Hướng dẫn tạo bài viết ngẫu nhiên cho blogspot 2021

Image
Hướng dẫn tạo bài viết ngẫu nhiên cho blogspot. Tiện ích bài viết ngẫu nhiên cho blogspot giới thiệu sau đây thay vì 1 lần tải toàn bộ feed thì sẽ tải lần lượt theo số bài viết muốn hiển thị và chỉ lấy duy nhất 1 bài trong 1 lần tải. Hướng dẫn tạo bài viết ngẫu nhiên cho blogspot 2021 Hướng dẫn tạo bài viết ngẫu nhiên cho blogspot Css giao diện Sao chép mã CSS này vào trước thẻ đóng  ]]</b:skin> #randomposts{padding:10px 10px 0} #randomposts .random_item{margin:0 10px 10px 0;display:block;float:left;width:calc(50% - 10px);height:auto;} #randomposts .random_items,#randomposts .random_item:nth-child(odd),#randomposts .random_item .clear{clear:both;} #randomposts .random_items{margin-right:-10px;} #randomposts .url_item{display:block;text-decoration:none;} #randomposts .img_item {display:block;margin-bottom:5px;padding:0;width:100%;height:auto;transition:all 400ms ease-in-out;} #randomposts .random_item:hover .img_item{opacity:.7;} #randomposts .title_item{display:block;padding-righ

Hướng dẫn sao lưu và import dữ liệu bài viết trong blogspot 2021

Image
Blogspot cho phép bạn sao lưu và phục hồi bài viết (bài đăng) trên blog của mình, (Còn gọi là Export / Import blog). Thao tác này sẽ rất hữu ích trong trường hợp blog bị xóa, hoặc bạn muốn chuyển bài viết blogspot sang nền tảng khác như WordPress, Tumblr… Hoặc đơn giản chỉ là muốn sao lưu cho chắc chắn. Hướng dẫn sao lưu bài viết blogspot File sao lưu của blogspot sẽ có định dạng *.xml, chứa thông tin của tất cả bài viết có trên blog của bạn với đầy đủ các bài viết và cả những lời chia sẻ của bạn bè trong từng bài viết - y hệt như trang blog hiện tại của các bạn, dung lượng ít hay nhiều tùy thuộc vào số lượng bài viết có trên blog. Để sao lưu bạn cần đăng nhập blog, vào mục Cài đặt > Quản lý blog > Sao lưu nội dung Sao lưu nội dung blog Lưu file *.xml về máy, mặc định tên của file xml sẽ là blog-thang-ngay-nam.xml (ví dụ: blog-06-18-2015.xml) nên đổi tên cho dễ quản lý. Với file xml này bạn có thể import sang blog mới, hoặc lên các nền tảng blog khác như Tumblr, WordPress… Hướn

Hướng dẫn xóa thông báo "Showing post with label" trong blogspot

Image
Bài viết này là một thủ thuật nhỏ giúp các bạn xóa hoặc thay đổi nội dung hoặc định dạng "Hiển thị bài đăng có NHÃN " của Blogger. Hiển thị tất cả các bài đăng thông báo và đó là hộp màu xám xấu xí (Theo mình thấy là vậy). Vì một lí do nào đó, Blogger không cung cấp bất kỳ cách nào để tùy chỉnh hoặc cấu hình thông báo này. Nhưng dễ dàng để xóa hoàn toàn nó, hoặc thay đổi định dạng, hoặc thay đổi văn bản Hướng dẫn xóa thông báo "Showing post with label" Xóa hoàn toàn Tìm kiếm giống với đoạn code dưới đây <b:includable id='status-message'>   <b:if cond='data:navMessage'>     <div class='status-msg-wrap'>       <div class='status-msg-body'>         <data:navMessage/>       </div>       <div class='status-msg-border'>         <div class='status-msg-bg'>           <div class='status-msg-hidden'><data:navMessage/></div>         </div>       </

Double click chọn tất cả code trong Blockquote Blogspot

Image
Nếu bạn đang cố gắng để làm cho blockquote tự động chọn khi ai đó nhấp đúp vào nó và tự hỏi làm thế nào?  Hôm nay trong bài viết này, tôi sẽ chia sẻ một thủ thuật có thể giúp độc giả của bạn dễ dàng sao chép mã của bạn từ phần blockquote. Double click to select all Blockquote dùng để lưu trữ code, các đoạn trích của trang web nhưng thường người dùng phải chọn toàn bộ từ trên xuống dưới để sao chép. Nếu Code dài, thì nó sẽ gây ra ít rắc rối cho người dùng. Vì bằng cách sử dụng click đúp là một phương án tối ưu nhất.  Cách tự động chọn tất cả mã code trong Blockquote Truy cập Blogger , đi tới Chỉnh sửa HTML chủ đề Tìm kiếm với thẻ </body> và copy đoạn mã javascript dưới đây vào trên thè đóng </body> <script type='text/javascript'>       var pres = document.getElementsByTagName(" blockquote ");       for (var i = 0; i < pres.length; i++) {       pres[i].addEventListener("dblclick", function () {       var selection = getSelection();      

Từng bước tạo TOC(Mục lục bài viết) cho blogspot 2021

Image
Bạn muốn web/blog của bạn trở nên chuyên nghiệp hơn, bạn có một bài viết dài và muốn cho khách hàng truy cập không phải cất công cuộn trang. Điều đó dẫn chúng ta đến suy nghĩ là nên có một " Mục lục bài viêt " ngay trong chính nội dung của mình. Như hình dưới Khách truy cập không cần phải bận tâm để cuộn xuống hoặc lên để tìm kiếm phụ đề. Với TOC (bảng nội dung), khách truy cập có thể trực tiếp nhảy liên kết nội bộ mà không cần phải nán lại để đọc nội dung của các bài viết trên blog, ngoài ra Giúp khách truy cập dễ dàng tìm thấy bài viết Rút ngắn thời gian để truy cập nội dung blog Cải thiện Seo Bài viết có cấu trúc hơn Từng bước tạo mục lục bài viết Thêm Javascript Truy cập Blogger, đi đến Chủ đề -> chọn Chỉnh sửa HTML -> dán mã code dưới vào trước thẻ </head> <script type='text/javascript'> //<![CDATA[  function mbtTOC() {var mbtTOC=i=headlength=gethead=0; headlength = document.getElementById("post-toc").getElementsByTagName("h2&q

Thêm hiệu ứng con trỏ chuột cho web/blog

Image
Nếu bạn muốn thêm một hiệu ứng đẹp vào trang web/blog của mình, thì bài đăng này là dành cho bạn. Bởi vì hiệu ứng này làm cho blog của bạn hấp dẫn hơn và khác biệt so với các blog khác. Ngôi sao rơi này sẽ đi theo con chuột. Bất cứ nơi nào chuột sẽ di chuyển, hiệu ứng của ngôi sao sẽ được nhìn thấy trên con trỏ chuột, ngay ở bài viết này của mình. Demo hiệu ứng chuột Thêm hiệu ứng con trỏ chuột vào blog của bạn: Truy cập Blogger.com Bấm menu Chủ đề Bấm vào Chỉnh sửa HTML Sau đó nhấp vào nút "Ctrl+F" trên bàn phím của bạn, tìm kiếm với từ khóa </body> Thêm mã bên dưới trước </body> <script type='text/javascript'> //<![CDATA[ var colour="#fff",sparkles=65,x=ox=400,y=oy=300,swide=800,shigh=600,sleft=sdown=0 ,tiny=new Array,star=new Array,starv=new Array,starx=new Array,stary=new Array,tinyx=new Array,tinyy=new Array,tinyv=new Array;function sparkle(){var t;if(x!=ox||y!=oy)for(ox=x,oy=y,t=0;t<sparkles;t++)if(!starv[t]){star[t].style.left

Thêm button download có đính kèm thông tin tệp với thời gian đếm ngược cho web/blog

Image
Nút download này đi kèm với một bộ đếm ngược giúp giảm tỷ lệ thoát trang của bạn rất nhiều. Bạn có thể tự mình quản lý thời gian của button. Ngay khi hết thời gian truy cập. Tệp bắt đầu tải xuống tự động. Trong nút download này, bạn cũng đã đưa ra tùy chọn tiêu đề, tên tệp, kích thước tệp và mô tả ngắn. Mà bạn có thể chỉnh sửa và thay đổi theo chính mình. Xem trước nút download Nếu bạn muốn thêm một hộp tải xuống vào blog của bạn sẽ nâng cao giao diện của blog của bạn. Vì vậy, bài viết này có thể giúp bạn rất nhiều. Để thêm nút download vào blog của bạn . Hướng dẫn thêm button download có đính kèm tệp Bước 1: Javascript Đầu tiên, bạn cần mở Blogger . Sau đó chọn  Menu Chủ đề và tiền hành chỉnh sửa HTML . Tìm kiếm (Ctrl + F) </head> Sau đó, bạn phải thêm mã trước khi </head> Bấm lưu Chủ đề . <script type='text/javascript'> //<![CDATA[ //CSS Ready function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var