Thủ thuật blogspot

Plus UI V3.1.0 - Responsive Blogger Template - Free Download

noreply@blogger.com (Unknown) — Wed, 26 Feb 2025 01:59:00 +0000

Plus UI là một Template được phát triền bởi DeoKumar với những tính năng nâng cao hơn và tuỳ chỉnh nhiều hơn so với phiên bản gốc Median UI. Đây là Template với sự kết hợp từ IMagz, Median UI và Fletro Pro của Jagodesain.

Tính năng của Plus UI Template

Plus UI được tạo với sự kết hợp của Median UI và Imagz là chủ yếu, nên các tính năng của Plus UI cũng có vẻ tương tự như Median UI và Imagz theo như bảng bên dưới.

Features	Availability
Mobile Responsive	Yes
Schema Markup	Yes
SEO Friendly	Yes
Ads Ready	Yes
Fast Loading	Yes
New Featured Post	Yes
Shortcode Support	No
Auto Read More With Thumbnail	Yes
Error 404	Yes
Responsive Footer	Yes
Social Follow Button	Yes
Multi Drop Down	Yes
Search Widget	Yes
Related Posts With Thumbnail	Yes
Social Share Button	Yes
Email News Letter Widget	Yes
Recent Post Widget	Yes
Detailed Documentation	Yes
Best Responsive Menu And Layout	Yes

Một số tính năng nâng cao

Plus UI với nhiều tính năng nâng cao khiến cho Template này có nhiều điều độc đáo.
Dưới đây là một vài tính năng nâng cao nổi bật của Plus UI.

Realtime Views: Bộ đếm số lượt xem theo thời gian thực trên bài đăng, Plus UI v2.6 sử dụng Cơ sở dữ liệu Firebase để lưu trữ số lượt xem.
Maintenance Mode: Tính năng bảo trì, khi bật thì người dùng truy cập sẽ nhận được thông báo bảo trì. Admin sẽ không thấy thông báo này để thuận tiện cho việc nâng cấp giao diện.
Quick Edit: Khi Admin truy cập vào trang Blog thì những nút chỉnh sửa nhanh sẽ hiện ra để cho bạn thuận tiện trong việc chỉnh sửa.
Bookmark Posts: Tính năng này giúp người dùng truy cập đánh dấu nhưng bài đăng nổi bật, nó sẽ bị xoá nếu người dùng xoá bộ nhớ đệm hoặc cookie.
System Default Mode: Tính năng này sẽ thay đổi chế độ Dảk Mode theo giao diện thiết bị của bạn đang dùng là Dark Mode hay Light Mode.
Theme Color:Let your visitors choose their favourite Theme Color for your Blog. You can set 10 Theme Colors of your desired colors.
Music Player: Tính năng trình phát nhạc, mình cũng đã có một bài viết hướng dẫn Tạo trình phát nhạc sử dụng JavaScript các bạn có thể tham khảo.
Countdown Download Box: Nút tải xuống với bộ đếm ngược.
Anti Ad-Blocker: Thông báo người dùng sử dụng trình chặn quảng cáo.
Cookie Consent: Thông báo với người dùng rằng Blog sử dụng Cookie để lưu trữ thông tin.
Country Block: Chặn người dùng đến từ một quốc gia cụ thể.
No Internet Connection: Thông báo khi người dùng mất kết nối với Internet.
Google Translate: Google dịch giúp người dùng đến từ nhiều quốc gia khác nhau.
Safelink: Giúp tăng lượt truy cập Blog của bạn nhờ tính năng Safelink
Article Rating: Giúp người dùng đánh giá nội dung của bạn.
Phía trên là một vài tính năng nâng cao của Template và là thông tin của Template. Tiếp theo đến với cách thức tải và dùng Template.

Xem thử và tải về

Demo

Plus-Ui-v3.1.0.zip 139 KB

Cách tạo chữ sáng tạo cùng hiệu ứng nét dùng cho tiêu đề blogspot

noreply@blogger.com (Unknown) — Fri, 07 Feb 2025 09:54:00 +0000

Trong thế giới phức tạp của thiết kế web ngày nay, kiểu chữ đóng vai trò là phương tiện biểu đạt mạnh mẽ, cải thiện khả năng sử dụng trang web và vượt ra ngoài phạm vi lựa chọn phông chữ và kích thước. Trong bài viết này, chúng ta sẽ khám phá một phần phụ của Kiểu chữ web, tức là xử lý phác thảo văn bản CSS, còn được gọi là nét chữ, cùng với các phương pháp khác nhau mà chúng ta có thể làm theo để đạt được hiệu ứng nét trong CSS.

Kiểu chữ nét trong CSS

- Sử dụng thuộc tính webkit-text-stroke không chuẩn.
Thuộc tính webkit -text-stroke là một thuộc tính CSS không chuẩn được sử dụng để áp dụng chiều rộng và màu của nét hoặc đường viền cho các ký tự văn bản. Đây là thuộc tính viết tắt cho các thuộc tính viết tắt -webkit-text-stroke-width và -webkit-text-stroke-color.
Được làm bằng:
HTML / CSS
Về mã:
Đây là một hiệu ứng văn bản động tuyệt đẹp được tạo bằng CSS.
Trình duyệt tương thích: Chrome, Edge, Firefox, Opera, Safari.

Preview

text fill effect

Cách thực hiện:
Thêm css

.text-fill {
	background:
		linear-gradient(blue 0 0) 
			0/ 100% repeat-y text;
	color: #0000; 
	animation: text-fill 8s 
		cubic-bezier(.35, 0, .35, 1) 
		infinite alternate
}

h1 {
	place-self: center;
    -webkit-text-stroke: 2px #386641;
    color: #0000;
	font-size: 70px;
    font-weight:900;
	font-family:"Open Sans",Helvetica,Arial,sans-serif;
	text-transform: capitalize;
}

HTML

<h1 class='text-fill'>thủ thuật blogspot</h1>

Áp dụng cho tiêu đề blogspot
Tùy thuộc vào phần thiết kế css của từng template nhưng cơ bản là sửa toàn bộ "header title" hoặc "blog title" của template dưới là một ví dụ.
Sửa css

#header h1 , #header h2, #header h1 a, #header h2 a, #header h1 a:hover,#header h2 a:hover { 
    place-self: center; 
    color:#0000;
	font-size: 70px;
    font-weight:900;
	font-family:"Open Sans",Helvetica,Arial,sans-serif;
	text-transform: capitalize;
}

Thêm css vào phần css chung của mẫu.

.text-fill {
	background:
		linear-gradient(blue 0 0) 
			0/ 100% repeat-y text;
	color: #0000; 
	-webkit-text-stroke: 2px #386641;
	animation: text-fill 8s 
		cubic-bezier(.35, 0, .35, 1) 
		infinite alternate
}  
  
@keyframes text-fill {
	0% { background-size: 0 }
}

Sửa HTML
Tìm:

<!--No header image -->
    <div id='header-inner'>
      <div class='titlewrapper'>
          <b:include name='title'/>
      </div>

Hoặc class='blog-title' ... vvv
Thay thành:

<!--No header image -->
    <div id='header-inner'>
      <div class='titlewrapper text-fill'>
          <b:include name='title'/>
      </div>

Hoặc class='blog-title text-fill' ...vvv
DEMO

Tạo văn bản hoạt hình sử dụng SVG

noreply@blogger.com (Unknown) — Fri, 24 Jan 2025 14:16:00 +0000

Bài viết này hướng dẫn cách tạo văn bản động hoạt hình sử dụng svg để trang trí hoặc tạo tiêu đề blog....
Demo:

Được làm bằng:
HTML / CSS / Javascript
Về mã:
Đây là một hiệu ứng văn bản động tuyệt đẹp được tạo bằng SVG.
Trình duyệt tương thích: Chrome, Edge, Firefox, Opera, Safari

Cách thực hiện

1- Thêm css

svg { 
  width: 100%;
  height: auto;
}
/* Tekststijl: vul met patroon, en gebruik dikkere stroke */
text {
  fill:#fff ;
  font-family: "Protest Guerrilla", sans-serif;
  font-size: 70px;
  letter-spacing: 5px;
  stroke: red;
  stroke-width: 3px;
  stroke-dasharray: 500;
  stroke-dashoffset: 500;
  filter: url(#glowFilter); /* Voeg gloedfilter toe */
}
<link href="https://fonts.googleapis.com/css2?family=Protest+Guerrilla&display=swap" rel="stylesheet"/>

2- Thêm javascript

<script>/*<![CDATA[*/
  // js is for the animation loop for the strokes
const textElement = document.getElementById("animatedText");

function restartAnimation() {
  textElement.style.transition = "none";
  textElement.style.strokeDashoffset = "0";

  setTimeout(() => {
    textElement.style.transition = "stroke-dashoffset 3s ease";
    textElement.style.strokeDashoffset = "1000";
  }, 50);
}

// Start de animatie direct en in een loop
restartAnimation();
setInterval(restartAnimation, 10000);
/*]]>*/</script>

3- Thêm HTML vào vị trí muốn hiển thị

<svg viewBox="0 0 800 200">
  <!-- Definieer een patroon voor de tekst -->
  <defs>
    <!-- Definieer gloedfilter -->
    <filter id="glowFilter" x="-50%" y="-50%" width="200%" height="200%">
      <feGaussianBlur in="SourceAlpha" stdDeviation="8" result="blurred" />
      <feOffset in="blurred" dx="0" dy="0" result="offsetBlurred" />
      <feFlood flood-color="cyan" result="glowColor" />
      <feComposite in="glowColor" in2="offsetBlurred" operator="in" />
      <feMerge>
        <feMergeNode />
        <feMergeNode in="SourceGraphic" />
      </feMerge>
    </filter>
  </defs>

  <!-- Tekst waarop het patroon en de gloed worden toegepast -->
  <text id="animatedText" x="50" y="150">THỦ THUẬT BLOGSPOT</text>
</svg>

Tạo khung chứa code sử dụng thẻ blockquote tự động copy trên blogspot

noreply@blogger.com (Unknown) — Sat, 18 Jan 2025 00:36:00 +0000

Bài viết này hướng dẫn cách tạo khung chứa code đơn giản và dễ sử dụng trong bài viết của bạn trên Blogger bằng thẻ <blockquote> vì việc sử dụng thẻ <blockquote> rất thuận tiện vì blogger đã tích hợp sẵn thẻ này trong phần soan thảo trên blogspot.

Xem demo.
DEMO

Các bước thực hiện

1- Thêm css

blockquote{position:relative;display:block;background-image: linear-gradient(#f5fffa 50%, #edf5ed 50%);background-size: 100% 3rem;background-position: 0 1.5rem;background-origin: content-box;font-family:"Consolas","Courier New",Courier,Monospace;font-size:14px;white-space:pre-wrap;line-height:1.7em;padding:28px 16px 16px;border:1px solid #ddd;border-radius:2px;overflow:auto} 
blockquote:before{content:'</>';position:absolute;right:0;top:0;color:red;font-size:13px;font-weight:700;padding:0 10px;z-index:2;line-height:35px}
blockquote:hover::before{content:'Nhấp để sao chép | Click to copy | </>';position:absolute;right:0;top:0;color:red;font-size:12px;font-weight:700;padding:0 10px;z-index:2;line-height:35px}

2- Sử dụng thẻ <blockquote> trong bài viết
Khi viết bài để sử dụng thẻ <blockquote> trong bài viết của mình thì chỉ cần chọn đoạn văn bản hoặc đoạn code, rồi vào thanh công cụ chọn biểu tượng có dấu 2 nháy (Trích dẫn văn bản)
3- Tích hợp tính năng tự động sao chép nội dung
Để người đọc có thể dễ dàng sao chép nội dung từ khung chứa code bằng cách nhấp chuột trái, bạn có thể thêm một đoạn JavaScript vào trước thẻ đóng </body> trong chủ đề của Blogspot.

<script>/*<![CDATA[*/
  function copyToClipboard(blockquoteElement) {
    const codeBlock = blockquoteElement.innerText;
    navigator.clipboard.writeText(codeBlock).then(() => {
      alert("Đã sao chép vào clipboard!");
    }).catch(err => {
      console.error("Lỗi khi sao chép: ", err);
    });
  }
  document.querySelectorAll('blockquote').forEach(blockquote => {
    blockquote.addEventListener('click', function() {
      copyToClipboard(this);
    });
  });
  /*]]>*/</script>

Kết luận
Sau khi bạn đã thực hiện các bước trên, khung chứa code của bạn sẽ không chỉ đẹp mắt mà còn tiện lợi cho người đọc khi muốn sao chép nội dung. Hãy thử nghiệm và tùy chỉnh các thuộc tính CSS theo ý thích của bạn!
Tham khảo thêm:
Khung chứa code nhấp đúp chuột trái để copy tại đây
Khung chứa code nhấp chuột trái để bôi đen tại đây
Chia sẻ lại từ thietkeblogger.com.

Trang trí hoa mai đèn lồng trên blogspot đón Tết Nguyên đán

noreply@blogger.com (Unknown) — Thu, 16 Jan 2025 08:22:00 +0000

Sắp tới Tết rồi chỉ còn ít ngày nữa là tới giao thừa. Đời thực đang rộn ràng hối hả, không khí mùa xuân đang tràn ngập mọi nơi. Chúng ta cũng nên đem không khí xuân vào trong thế giới ảo mà ở đây là những trang web/blog để khách viếng thăm blog/web có thể cảm nhận được không khí tết đang ngập tràn muôn nơi.

Dưới đây là code giúp mọi người thực hiện điều đã nói ở trên (Chủ yếu là chia sẻ mấy ảnh phù hợp ^^).

1- 2 cành mai vàng
DEMO
Các bước thực hiện.
Thêm css

<style>/*<![CDATA[*/
.tet_left img,.tet_right img{width:100%;height:auto}
.tet_left{position:fixed;top:0;left:0;z-index:9;width:266px;pointer-events:none}
.tet_right{position:fixed;top:0;right:0;z-index:9;width:181px;pointer-events:none}
@media screen and (max-width:1400px){.tet_left{display:none !important}
}
/*]]>*/</style>

Css trên đã bỏ hoa mai bên trái từ độ phân giải 1440px.
Thêm HTML vào trước thẻ đóng </body>

<div class='tet_left'><img alt='tet' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjLkj9qKeF-IgXZU0pWxbzMi2HO6lbKjhcrh3e3CSo0p_DkX72jjsryK1HRA_0o7pirL814jvmUxK8UUC0L45TvRFwiD2dLcWhhbME0AFjMP15qJXhHZTQMpPdH1BvYYFuvtYf0mBFBZI1yjpSvmVAZiwi30XGqJJ0w-JB51UlJxp4KLhVbk0K2RlGm-aq/s1600/tet-left.png'/></div> <div class='tet_right'><img alt='tet' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga1hhkN4RmxSF8MKyGV3FhIU4kp8gu2VHdJWWGfqXm3dnvgUvpvytY793utvJ6UUDqnK1D9SxA1lhTNBP1l5FnUoDYCaVMr6y6xE5ykqo0jCjiTum4_Azw-tUrZWYSgKLNkr0Z9kV-hO37yLLlLOspKfqu8Y3wB7zhKY_yBW6uiE2JT9Nf2LsVOUcvsgmy/s1600/tet-right.png'/></div>

Lưu ý
Nếu muốn trang trí hoa mai đèn lồng bên phải thì chỉ cần thêm code bên dưới vào trước thẻ đóng </body>

<img alt='tet' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga1hhkN4RmxSF8MKyGV3FhIU4kp8gu2VHdJWWGfqXm3dnvgUvpvytY793utvJ6UUDqnK1D9SxA1lhTNBP1l5FnUoDYCaVMr6y6xE5ykqo0jCjiTum4_Azw-tUrZWYSgKLNkr0Z9kV-hO37yLLlLOspKfqu8Y3wB7zhKY_yBW6uiE2JT9Nf2LsVOUcvsgmy/s1600/tet-right.png' style='position:fixed;top:0;right:0;z-index:9;width:181px;pointer-events:none;border:none;' />

2- 2 cành đào và mai

CSS

<style>/*<![CDATA[*/
.tet_left img,.tet_right img{width:100%;height:auto}
.tet_left{position:fixed;top:0;left:0;z-index:9;width:259px;pointer-events:none}
.tet_right{position:fixed;top:0;right:0;z-index:9;width:181px;pointer-events:none}
@media screen and (max-width:1400px){.tet_left{display:none !important}
}
/*]]>*/</style>

HTML

<div class='tet_left'><img alt='tet' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJCV87dQW0Bx1zzkzm9LRQPFGt-k0anI3PClrzNlvEL9yHiFcge67ZhPgINkq_tlPAfXpOULWJlFnzoTPmlhec6ORDJc3XuzEKjxf8J7ookoJ1e-vVvYds-OUWAT_ixYt71gyTWZ-6a0NJPfqCaZhTLczaDT_ahF3VueAj_8O3wfvbzyIRIMxsm-NgtZqK/s1600/hoa-dao-trai.png'/></div> <div class='tet_right'><img alt='tet' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga1hhkN4RmxSF8MKyGV3FhIU4kp8gu2VHdJWWGfqXm3dnvgUvpvytY793utvJ6UUDqnK1D9SxA1lhTNBP1l5FnUoDYCaVMr6y6xE5ykqo0jCjiTum4_Azw-tUrZWYSgKLNkr0Z9kV-hO37yLLlLOspKfqu8Y3wB7zhKY_yBW6uiE2JT9Nf2LsVOUcvsgmy/s1600/tet-right.png'/></div>

3- Cành đào lồng mai

CSS

<style>/*<![CDATA[*/
.tet_left img,.tet_right img{width:100%;height:auto}
.tet_left{position:fixed;top:0;left:0;z-index:9;width:259px;pointer-events:none}
.tet_left2{position:fixed;top:0;left:0;z-index:7;width:266px;pointer-events:none}
.tet_right{position:fixed;top:0;right:0;z-index:9;width:181px;pointer-events:none}
@media screen and (max-width:1400px){.tet_left{display:none !important}
}
/*]]>*/</style>

HTML

<div class='tet_left'><img alt='tet' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJCV87dQW0Bx1zzkzm9LRQPFGt-k0anI3PClrzNlvEL9yHiFcge67ZhPgINkq_tlPAfXpOULWJlFnzoTPmlhec6ORDJc3XuzEKjxf8J7ookoJ1e-vVvYds-OUWAT_ixYt71gyTWZ-6a0NJPfqCaZhTLczaDT_ahF3VueAj_8O3wfvbzyIRIMxsm-NgtZqK/s1600/hoa-dao-trai.png'/></div> <div class='tet_right'><img alt='tet' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga1hhkN4RmxSF8MKyGV3FhIU4kp8gu2VHdJWWGfqXm3dnvgUvpvytY793utvJ6UUDqnK1D9SxA1lhTNBP1l5FnUoDYCaVMr6y6xE5ykqo0jCjiTum4_Azw-tUrZWYSgKLNkr0Z9kV-hO37yLLlLOspKfqu8Y3wB7zhKY_yBW6uiE2JT9Nf2LsVOUcvsgmy/s1600/tet-right.png'/></div>  
<div class='tet_left2'><img alt='tet' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjLkj9qKeF-IgXZU0pWxbzMi2HO6lbKjhcrh3e3CSo0p_DkX72jjsryK1HRA_0o7pirL814jvmUxK8UUC0L45TvRFwiD2dLcWhhbME0AFjMP15qJXhHZTQMpPdH1BvYYFuvtYf0mBFBZI1yjpSvmVAZiwi30XGqJJ0w-JB51UlJxp4KLhVbk0K2RlGm-aq/s1600/tet-left.png'/></div>

Tham khảo thêm các hiệu ứng.
- Code dây đèn nhấp nháy và hiệu ứng pháo hoa cho blog nền đen

- Hiệu ứng pháo hoa cho blogspot nền đen

- Tạo pháo hoa năm mới

- Tổng hợp hiệu ứng pháo hoa cho blogspot

63 templates blogspot/blogger premium free hay sử dụng miễn phí tải về

noreply@blogger.com (Unknown) — Thu, 05 Dec 2024 15:59:00 +0000

Tổng hợp các mẫu blogspot/blogger cao cấp cho tới thời điểm hiện tại mà người dùng viết blog dựa trên nền tảng blogger ưa dùng.

Các mẫu blogspot/blogger được chia sẻ sau đây đều không mã hóa javascript, code sạch sẽ không có mã độc và hoàn toàn miễn phí tải về không kèm điều khoản gì cả.

Đến thời điểm này vẫn có nhiều người sử dụng blogspot trong công việc của mình vì nó hoàn toàn miễn phí cùng với việc sử dụng mã nguồn mở nên người dùng có thể tùy biến theo nhu cầu của riêng mình.

Dưới đây là 63 templates blogspot/blogger premium free hoàn toàn miễn phí tải về để các bạn tùy ý lựa chọn phù hợp với công việc của riêng mình.

1- SuperMag Premium

Super Mag là một Theme Blogspot rất mạnh mẽ và chuyên nghiệp . SuperMag rất nhanh và được tối ưu hóa, cho phép trang web của bạn nhận được kết quả tốt nhất trên Công cụ tìm kiếm.
Live demo | Download

2- Pixel Blogger Template

Đây là mẫu Blogger hoàn toàn miễn phí, mã nguồn mở và có thể tùy chỉnh (dựa trên nền tảng blogger) dành cho trang web theo phong cách tạp chí và tin tức ở bất kỳ vị trí thích hợp nào. Mẫu này miễn phí cho mục đích sử dụng thương mại và cá nhân nhưng không có hỗ trợ.
Live demo | Download

3- Speedy Piki Premium

Bạn có thể sử dụng mẫu Speedy Piki trên blog của mình phục cho nhiều công việc trong các lĩnh vực khác nhau, nó rất phù hợp với nút tải thêm bài đăng đã được thêm vào. Và thanh bên cũng như phần chân trang chỉ có những tiện ích thật cần thiết, bạn có thể thêm logo blog và các biểu tượng mạng xã hội của mình.
Live demo | Download

4- Median UI v1.7

Median UI là một mẫu Blogger cổ điển được tạo bởi Jago deasain, mẫu này được thiết kế với khái niệm UI. Thực tế đây là template sạch sẽ và có tốc độ tải nhanh khiến nó trở thành một trong những template blogger tốt nhất, một thiết kế đơn giản hơn nhưng có khả năng đọc cao là điểm cộng của template này.
Live demo | Download

5- JetTheme Newspaper v1.9

Jet Theme đã được chứng minh là một trong những mẫu blogger tốt nhất năm 2022. Nó đi kèm với phiên bản miễn phí và phiên bản trả phí. Phiên bản miễn phí có tên là Jet Theme 'Phiên bản Blog-Blog Version'. Phiên bản trả phí có tên là Jet Theme 'Phiên bản báo chí-Newspaper Version'.
Live demo | Download

6- Plus UI v2.6.1 và Plus UI v2.6.2 - Không cần license key

Mẫu blogger đáp ứng Premium Design Plus UI phiên bản v2.6.1 không cần nhập key và không mã hóa javascript. Giao diện người dùng Plus là một trong những mẫu tải nhanh, thân thiện với SEO, phản hồi nhanh và tải nhanh tốt nhất.

Mẫu này có thể được sử dụng để tạo các blog như tin tức công nghệ, viết blog, Phần mềm, trò chơi, v.v. Nói chung, mẫu blogger Plus UI được thiết kế cho các blog hoặc trang web hiện đại.
Phiên bản Plus UI v2.6.1
Live demo | Download
Phiên bản Plus UI v2.6.2
Live demo | Download

Tài liệu tham khảo tại đây

7- Plus UI Landing page v2.6

Plus UI Landing Page v2.6 Tải xuống miễn phí mẫu Blogger: là một mẫu hiện đại, không cần nhập key và không mã hóa javascript sẽ cung cấp cho bạn các tính năng tuyệt vời và hữu ích.

Plus UI là Mẫu Blogger chuyên nghiệp, linh hoạt và được tối ưu hóa cao. Mẫu Blogger tốt nhất cho Tin tức công nghệ, Tiếp thị, Mẹo SEO, Video, Trang web thực phẩm và hơn thế nữa. Plus UI đã được tối ưu hóa cho các công cụ tìm kiếm chính để bạn có thể nhận được kết quả không phải trả tiền tốt nhất. Nó cũng hoàn toàn thân thiện với mọi thiết bị di động.
Live demo | Download

8- Lantro UI v1.4

Lantro UI v1.4 - Standard Responsive Free: Lantro UI v1.4 là một mẫu blogger đẹp và hấp dẫn với rất nhiều tính năng được tối ưu hóa SEO, hiệu suất tốt, thân thiện với quảng cáo, thân thiện với thiết bị di động, thiết kế hiện đại và hơn thế nữa.

Điều thú vị là mẫu cố gắng cung cấp cho bạn các bản cập nhật thường xuyên với các bản sửa lỗi. Mẫu này hoàn hảo cho các trang web công nghệ, trang web thực phẩm, trang web hướng dẫn và hơn thế nữa.
Live demo | Download

9- Imagz Plus UI Premium

Template blogger iMagz Pro rất phù hợp với các chủ đề blog khác nhau. Với thiết kế hiện đại iMagz Pro có các tính năng ưu việt, nó sẽ hỗ trợ hiệu quả cho blog của bạn.

Ví dụ, các blog có niche tin tức bạn có thể sử dụng tính năng chia bài đăng như trang Tin tức nói chung. Nếu bạn muốn bán hàng hóa và dịch vụ với các tính năng trang đích hiện có, tất nhiên nó sẽ rất hữu ích.

Mẫu iMagz Pro có 2 phiên bản là iMagz + Landing Page và phiên bản iMagz Standard. Điều làm cho nó khác biệt là việc loại bỏ tính năng trang đích trong phiên bản tiêu chuẩn. IMagz Standard dành riêng cho những bạn không cần blog có trang đích.
Live demo | Download

10- Gameify Premium

Gameify là mẫu Blogger Blog và Tạp chí được thiết kế bởi Templateify. So với các mẫu khác, Gameify có nhiều các tính năng nâng cao ưu việt và độc quyền sẽ làm cho trang web của bạn trở thành cấp độ xuất sắc cao nhất cho các blogger.

Mẫu Gameify Blogger được tải rất nhanh chóng và được tối ưu hóa hoàn toàn cho SEO (Tối ưu hóa công cụ tìm kiếm), có thể giúp bạn cải thiện đáng kể công cụ tìm kiếm và các dịch vụ khác trên trang web của mình. Và, tất nhiên, Gameify tương thích với AdSense và được tối ưu hóa cho thiết bị di động.
Live demo | Download

11- MSD Grid Premium

MSD-MSDesign Grid là một bố cục blogger đáp ứng gọn gàng, linh hoạt cho phép bạn sử dụng là trang blog/web với chủ đề công nghệ, trò chơi, du lịch, phim, tạp chí và blog cá nhân ... Với giao diện hài hòa, hấp dẫn, tiện lợi... và có thể làm vừa ý những người viết blog khó tính nhất.
,br/> Với điểm quan trọng là giảm tỷ lệ ricochet, đồng thời mở rộng giới thiệu quảng cáo, chủ đề này giúp khách truy cập dễ tìm kiếm nội dung và điều hướng, đồng thời tăng thu nhập từ quảng cáo của bạn! Nếu bạn đang tìm kiếm bố cục kiểu blogger theo phong cách Tạp chí, thì tại thời điểm này, đây là lựa chọn tốt nhất cho bạn.
Live demo | Download

12- Fletro Pro v6.0 và Fletro Pro v6.1

Fletro Pro V6.1 Premium là một mẫu blogger đáp ứng nhanh, chuyên nghiệp, hiện đại và hoàn toàn có thể tùy chỉnh.

Fletro Pro V6.1 Premium cũng rất thuận tiện để cho bạn kiếm tiền từ trang web/blog của mình thông qua các biểu ngữ, banner vì nó có nhiều không gian có thể đặt quảng cáo. Nó phù hợp cho các blogspot hướng dẫn, phân phối, tạp chí hoặc làm blog cá nhân cùng nhiều lĩnh vực khác...

Fletro Pro V6.0 Premium hoàn toàn có thể tùy chỉnh có nghĩa là bạn có thể tạo các blog khác nhau từ cùng một mẫu. Các tùy chỉnh được thực hiện thông qua trang dành riêng cho blogger để phục vụ mục đích này.

Fletro Pro v6.0
Live demo | Download

Fletro Pro v6.1
Live demo | Download

13- VTrick – Creative v1.5.11

VTrick – Creative Blogger Template v1.5.11 - là một chủ đề và mẫu blogger đáp ứng đầy đủ được thiết kế cho blog chia sẻ kiến thức, blog cá nhân và nhiều các danh mục khác.

Giao diện đa dạng, hiện đại và chuyên nghiệp tốt nhất, với mã sạch làm cho trang web của bạn trở nên mạnh mẽ, hấp dẫn, đáp ứng và dễ sử dụng. VTrick là một chủ đề chia sẻ theo phong cách hiện đại và mẫu hoàn hảo cho cá nhân, công ty và đại lý.
Live demo | Download

14- VTrick v1.9.0

VTrick Blogger Template là một mẫu blogspot/blogger có thể dùng cho nhiều chủ đề từ blog cá nhân cho tới chủ đề tin tức. Mẫu được thiết kế lại dựa trên mẫu Colorify và lấy cảm hứng từ mẫu CSS-Trick đã được tác giả tối ưu hóa để phù hợp hơn.

VTrick là mẫu blogger đáp ứng chuyên nghiệp và được tối ưu cho các công cụ tìm kiếm. Vtrick thân thiện với thiết bị di động và hoàn toàn tương thích với google adsense cũng như các nền tảng kiếm tiền khác. VTrick hoàn toàn có thể tùy chỉnh và có nhiều tính năng độc đáo để bạn có thể tạo trang web chuyên nghiệp của riêng mình trên nền tảng blogspot.
Live demo | Download

15- Median UI v1.6

Chủ đề Median UI blogger cũng đã quen thuộc với những ai sử dụng nền tảng blogger làm web/blog phục vụ nhu cầu truyền tải thông tin hay chia sẻ kiến thức, phần mềm, ảnh hot girl.....

Với các mẫu Median UI v1.3 tới v1.5 mọi người đang sử dụng nó đơn giản trang nhã và điều cốt yếu là đem lại trải nghiệm người dùng.

Median UI Responsive Blogger Template được thiết kế với giao diện dashboard UI, đáp ứng đầy đủ các tiêu chí như: Responsive, tối ưu hoá công cụ tìm kiếm, trang 404, tiện ích xã hội, nút chia sẻ xã hội và còn rất nhiều các tiêu chí khác. Median UI v1.6 có lẽ là bản Median UI cuối cùng mà tác giả Muhammad Maki muốn phát hành tới những người dùng blogspot.
Live demo | Download

16- Appiki - App Store

Piki Templates | Appiki - App Store & Review Blogger Template là một Android Blogger Template được thiết kế nâng cao so với các mẫu tương tự trước đây.

Bạn đã đạt được 50% của sự thắng lợi nếu bạn có được mẫu blog tuyệt vời này phục cho việc viết về chủ đề chia sẻ game. Mẫu blogger APPIKI không chỉ phù hợp tiêu chí bắt mắt bạn mà còn được một mẫu blogger đã được tối ưu hóa và sẵn sàng sử dụng.

Tôi muốn giới thiệu cho bạn Mẫu APPIKI Blogspot của Piki Templates , một mẫu tải xuống ứng dụng và một cửa hàng ứng dụng. Đây là một trong những mẫu tải xuống tuyệt vời nhất trên internet cho ứng dụng Blogger.
Live demo | Download

17- Foodify Premium

Foodify Blogger Template sẽ phục vụ bạn tốt nhất nếu bạn muốn phát triển một blog về ẩm thực, quán cà phê hoặc nhà hàng. Mẫu miễn phí này được phát triển đặc biệt cho các nhà hàng như vậy.

Nó đi kèm với 5 chủ đề màu sắc cài sẵn tuyệt đẹp. Bạn có thể dễ dàng phát triển chủ đề của riêng mình bằng cách sử dụng mẫu này. Bạn sẽ thấy chủ đề này siêu phản hồi.
Live demo | Download

18- TechMag Premium

TechMag là mẫu blogger chuyên nghiệp và thanh lịch và là một chủ đề hoàn toàn có thể tùy chỉnh, vì vậy bạn có thể tải về chủ đề này phục cho công việc của mình.

TechMag là một chủ đề blogger rất nhanh, có tốc độ hơn 80 trên thiết bị di động và máy tính để bàn. Các tính năng cốt lõi của chủ đề này là thiết kế sạch sẽ và trang nhã, bài viết nổi bật, quảng cáo đáp ứng, phiên bản RTL , v.v.
Live demo | Download

19- Starter Premium

Starter Premium là một Mẫu Blogger đáp ứng chuyên nghiệp. Starter thân thiện với thiết bị di động, nó cũng hoàn toàn tương thích với Google AdSense và các nền tảng kiếm tiền khác.

Mẫu Blogger Starter Premium rất phù hợp với người mới bắt đầu sử dụng blogger vì nó đơn giản, tải nhanh và được tối ưu hóa hoàn toàn cho các công cụ tìm kiếm. Nó siêu sạch vì không mã hóa và không cài link dẫn đến trang đích không mong muốn.
Live demo | Download

20- Foxify Premium

Foxify Premium Blogger Template có thể là một mẫu blogger được tối ưu hóa hoàn toàn cho SEO, mẫu này phù hợp với nhiều ngách như tin tức, tạp chí, sàn giao dịch chứng khoán và các blog khác nhau. Nó rất dễ dàng để tùy chỉnh và tải nhanh chóng.

Foxify Premium Blogger Template cực kỳ đơn giản và hấp dẫn bowid giao diện của nó. Foxify Premium hỗ trợ tất cả các loại thiết bị cho điện thoại di động, máy tính bảng, máy tính xách tay, máy tính để bàn. Trong trường hợp này, bạn có thể tìm thấy nhiều tùy chọn mới nhất như Dark Mode, RTL, Mega menu, v.v.
Live demo | Download

21- SeoPro v1.4 Premium

SeoPro Blogger Template - Mẫu Blogger đáp ứng là một mẫu blogger hoàn toàn có thể tùy chỉnh.

SeoPro Blogger Responsive Blogger Template là một mẫu blogger được tối ưu hóa cao và nhanh chóng. SeoPro cực kỳ dễ thiết lập và có các tính năng độc đáo mà không yêu cầu bạn sửa đổi một dòng mã.
Live demo | Download

22- Galaxy Mag Premium

Galaxy Mag phiên bản Premium full code không mã hóa. GalaxyMag Blogger Template là một mẫu Blogger chuyên nghiệp, đẹp, mạnh mẽ và linh hoạt cho các trang web blog, Tin tức và Tạp chí.

Mẫu Blogger Galaxy Mag này là mẫu blogger có thể tùy chỉnh hoàn toàn. Mẫu Blogger này là mẫu blogger có thể sử dụng dễ dàng nhiều Tính năng cao cấp Có sẵn trên mẫu này. Mẫu Blogger Galaxy Mag này thiết kế rất đẹp, dễ dàng thiết lập các kiểu hiển thị tin ở trang chủ.
Live demo | Download

23- Treasury Premium

Treasury Blogger Template là một mẫu blogger đơn giản và sạch sẽ. Đây là mẫu blogger có độ phản hồi cao. Nó được thiết kế đặc biệt cho các trang web thời trang, nhiếp ảnh và giải trí.

Nó là chủ đề được tối ưu hóa cao cho blogger. Đây là một chủ đề tạp chí miễn phí và nhiều tính năng có trong mẫu này. Đây là sự lựa chọn tốt nhất cho tất cả các trang web thời trang và nhiếp ảnh của bạn. Nó rất dễ sử dụng mẫu.
Live demo | Download

24- Freezify Premium

Freezhify Responsive Blogger Templates là mẫu blogspot chỉnh sửa từ mẫu Freedify 1.0.0, trong đó bố trí lại một số chi tiết để giao diện nhìn hài hòa hơn.

Freezhify là mẫu blogspot phù hợp với nhiều chủ đề như; Blog cá nhân, blog chia sẻ thủ thuật hay chia sẻ template cũng được....
Live demo | Download

25- Colorify v1.5.0 Premium

Colorify v1.5.0 Premium Blogger Template - là một mẫu blogger đáp ứng khá đầy đủ, được thiết kế cho đa dạng các chủ đề như trang trình chiếu phim ảnh, chia sẻ video, blog cá nhân hay chủ đề chia sẻ phần mềm, game và nhiều lĩnh vực khác.
Live demo | Download

26- Seoify v1.3.0 Premium

Seoify Pro Premium là một mẫu blogger chuyên nghiệp. Nó hoàn toàn có thể tùy chỉnh nếu bạn có ý định chỉnh sửa hoặc thay đổi style.

Seoify Pro là một mẫu blogger đơn giản, nhưng có thể mang lại hiệu quả cao về seo cũng như khai thác hiệu suất quảng cáo, bởi vì nó được phát triển với các tiêu chuẩn mới nhất về css, javascript và HTML.
Live demo | Download

27- Litespot Việt hóa Premium

Litespot nguyên mẫu chủ yếu dùng cho blog sử dụng tiếng Anh và tiếng Arap... nhưng có điều khi dùng cho tiếng Việt bị lỗi một vài tính năng như "Xem tất cả" tháng là tiếng Anh không chuyển sang tiếng Việt được nếu muốn chuyển phải thêm javascript json trong khi javascript json gây lỗi HTML5.

Mẫu Litespot Việt hóa phần nào khắc phục được những điều ở trên. Nói là việt hóa cho nó sang chứ thực ra cũng là sửa đổi một chút trong mẫu và đổi về tiếng Anh không còn khả dụng.
Live demo | Download

28- Spotlight Premium

Spotlight Blogger là một mẫu blogger sạch sẽ và thanh lịch, nó được thiết kế lại từ nguyên mẫu Litespot. Các tính năng cốt lõi của Spotlight là thiết kế sạch sẽ và trang nhã, chế độ tối bằng một lần nhấp, bài đăng liên quan nâng cao, các nút Gradient, v.v.
Live demo | Download

29- Jannify Premium

Jannify là mẫu Blogger đáp ứng phong cách thanh lịch. Nếu bạn đang tìm kiếm tin tức hoặc tạp chí dựa trên web, thì đó là một trong những lựa chọn hoàn hảo.

Nó hoạt động với cả trình duyệt dành cho thiết bị di động và máy tính để bàn một cách linh hoạt. Nó cũng có tính năng chế độ tối để cải thiện trải nghiệm người dùng, theo yêu cầu mới nhất.
Live demo | Download

30- Newspeed Premium

Newspeed là một mẫu blogger / blogspot đáp ứng chuyên nghiệp. Nó lý tưởng cho các trang web tin tức và tạp chí, thể thao, trò chơi, tài chính, blog thực phẩm và các trang web khác.

Newspeed hoàn toàn đáp ứng và có thể tùy chỉnh, điều này sẽ cho phép bạn tạo các kiểu khác nhau cho các trang web khác nhau mà không cần phải chỉnh sửa một dòng mã nào.
Live demo | Download

31- Anartisis Premium v2.0.1

Anartisis - Tin tức & Tạp chí, Anartisis v2.0.1 - Chủ đề Blogger Tin tức & Tạp chí hoàn hảo cho các nhà xuất bản, tạp chí, tạp chí, blog và các trang web tin tức khác, Anartisis Blogspot Template là một công cụ tuyệt vời cho những người muốn làm việc tại một vị trí blog.
Live demo | Download

32- Edumagz Premium

Edumagz là một chủ đề blog & giáo dục cao cấp phù hợp với các blog giáo dục hoặc trường học. Chủ đề Edumagz tốt nhất này đi kèm với các tính năng tuyệt vời.

Bố cục đáp ứng, trình chiếu bài đăng trên blog để làm nổi bật các bài đăng yêu thích của bạn, các phần tử mã ngắn được thiết kế đặc biệt để hiển thị các bài đăng gần đây, bài đăng liên quan và hộp tác giả, các tiện ích tùy chỉnh để hiển thị quảng cáo hoặc lịch trình các khóa học.
Live demo | Download

33- Raghda Premium

Raghda Premium là một mẫu blogger thanh lịch và hiện đại với chủ đề hồ sơ công ty. Chủ đề này sẽ trông tuyệt vời trên bất kỳ thiết bị nào với bố cục đáp ứng cũng phù hợp với kích thước màn hình thiết bị của bạn.

Nó được tạo ra một cách có chủ đích để trông giống như WordPress và Joomla thay vì một mẫu blogger truyền thống. Tận dụng phong cách rõ ràng và sắc nét, các tính năng độc đáo và các yếu tố đồ họa tùy chỉnh để làm cho chủ đề này nổi bật so với phần còn lại.
Live demo | Download

34- Fastest Premium

Fastest Premium Blogger Template là mẫu blogger nhanh nhất được xây dựng bằng HTML5 và CSS3, nó hoàn toàn đáp ứng và trông hoàn hảo trên mọi thiết bị. Nó có một bố cục rõ ràng và một số lượng lớn các tính năng.

Các tính năng chính của mẫu này bao gồm hơn 10 thanh trượt khác nhau, tiện ích con tùy chỉnh, thiết kế đáp ứng, menu thả xuống 3 cấp với hỗ trợ hình nền toàn màn hình, hỗ trợ phông chữ Google và thân thiện với SEO.
Live demo | Download

35- Photo Blogger Premium

Bạn đang tìm một mẫu blogspot để làm chủ đề về ảnh, nơi bạn muốn lưu giữ và chia sẻ những tấm ảnh đẹp của cá nhân hoặc những tấm ảnh về phong cảnh, ảnh hotgirl.... Photo Blogger Template là mẫu blogger phù hợp để làm về chủ đề chia sẻ, lưu giữ các bức ảnh đẹp.

Giao diện blogspot album ảnh được thiết kế đẹp chức năng slider, zoom ảnh phong cách Landing page mới mẻ trên nền tảng website blogspot.
Live demo | Download
Bản tiếng Việt.
Download

36- Storyify Premium

Storify Blogger Template là một chủ đề tập trung vào nội dung tuyệt vời, rất thích hợp cho các nhà hoạt động, nhà báo, người viết blog, nhà văn và tác giả. Chủ đề Blogspot tối thiểu này có độ phản hồi cao và hoạt động hoàn hảo trên tất cả các thiết bị bao gồm máy tính bảng, thiết bị di động, máy tính để bàn vì nó có thể tự động điều chỉnh kích thước.
Live demo | Download

37- ProfilevCard Premium

ProfilevCard Mẫu Blogger cá nhân đáp ứng Phiên bản cao cấp. Bạn có thể dễ dàng thay đổi tín dụng chân trang và sử dụng các mẫu blogger này cho các trang web không giới hạn.

Mẫu blogger thiết kế tuyệt vời này được xây dựng bởi Muhammad Maki và được phát hành lần đầu tiên vào ngày 6 tháng 10 năm 2020. Cập nhật lần cuối vào ngày 24 tháng 1 năm 2020. Mẫu Blogger phản hồi ProfilevCard có thiết kế đáp ứng đầy đủ giúp nội dung của bạn trông tuyệt vời trên mọi loại thiết bị.
Live demo | Download

38- Moview Premium

Moview là một mẫu blogger đáp ứng và cao cấp được sử dụng cho các loại blog và trang web về Phim, Điện ảnh & Đánh giá Phim, v.v. Chủ đề này đi kèm với nhiều tính năng độc đáo, cao cấp và tuyệt vời giúp bạn trở nên hấp dẫn hơn và thân thiện hơn với người dùng. Nói chung loại chủ đề này được gọi là Phiên bản cao cấp nhưng một số nhà thiết kế mẫu blogger cũng tung ra phiên bản miễn phí.
Live demo | Download

39- IDBlanter Premium

IDBlanter là một trong những Template Blogger cao cấp, đáp ứng tốt nhất, thiết kế material design. Tải xuống Mẫu Blogger cao cấp của IDBlanter.

Nếu bạn đang tìm kiếm một mẫu blogger thiết kế material design đáp ứng, tìm kiếm cao cấp, mẫu blogger có thể tùy chỉnh miễn phí, mẫu blogger trang đơn, gọn gàng hơn thì bài viết này sẽ hữu ích cho bạn, hãy tải xuống các mẫu blogger trả phí miễn phí.
Live demo | Download

40- Freebify v1.0.0 Premium

Freebify là một trong những Mẫu Blogger chuyên nghiệp, đáp ứng. Tải xuống Mẫu Blogger phiên bản cao cấp Freebify.

Nếu bạn đang tìm kiếm Mẫu Blogger sạch, đáp ứng, cao cấp, trả phí . Bài viết này sẽ hữu ích cho bạn. Tải xuống các Mẫu Blogger cao cấp.
Live demo | Download

41- Official Magazine (Original) Premium

Official Magazine là mẫu tạp chí, tin tức, đa năng, mẫu Blogger cao cấp mới nhất. Tải xuống mẫu Blogger cao cấp của Tạp chí Officerilal.

Nếu bạn đang tìm kiếm Mẫu Blogger đa năng, tạp chí, cao cấp, miễn phí, có trả phí. Bài viết này sẽ hữu ích cho bạn. Tải xuống các Mẫu Blogger cao cấp miễn phí.
Live demo | Download

42- Power APK Premium

Power APK Blogger Template là một mẫu blogger cao cấp và đáp ứng . Đây là một chủ đề APK xu hướng khác cho nền tảng blogspot được chuyển thể từ WordPress .

Một chủ đề lý tưởng thực sự cho các blog thích hợp android. Nó hoàn toàn động hoạt động trên chế độ kéo thả tự động. Nó hiển thị nội dung bằng cách gán nhãn cho bài viết của bạn.
Live demo | Download

43- Vlogger Premium

Vlogger Blogger Template là một mẫu blogger video cao cấp hoàn hảo cho Youtuber , Podcaster, cổng phim, trang web chia sẻ video, blog hoạt hình và trang web blogger YID.

Nó được thiết kế đặc biệt để giới thiệu các video YouTube của bạn một cách năng động theo cách thực tế, mang lại vẻ đẹp bổ sung cho trang web blogger của bạn.
Live demo | Download

44- Cleanify Premium

Cleanify Premium là một mẫu blogger rõ ràng và đáp ứng cho các trang web đánh giá công nghệ và tiện ích. Thiết kế đáp ứng tự động thích ứng với các thiết bị di động, mang lại trải nghiệm xem tuyệt vời với bố cục thông minh.

Các tính năng khác bao gồm menu thả xuống nhiều cấp, thanh bên được mở rộng, cấu trúc mã thân thiện với SEO, kiểu bài đăng có thể tùy chỉnh (toàn chiều rộng hoặc đóng hộp giống như trang chủ)
Live demo | Download

45- Sure APK Premium

Sure APK – Responsive Blogger Template là mẫu blogger tải nhanh và được tối ưu hóa SEO để tạo điều kiện cho trải nghiệm người dùng của bạn. Có bốn hộp bài mới theo nhãn để bạn giới thiệu những tựa game hay sp hot.
Live demo | Download

46- Blue APK Premium

Blue APK là một mẫu blogger tốt nhất cho trang web tải xuống ứng dụng Android của bạn. Mẫu Blogger đáp ứng APK Pro màu xanh lá cây là mẫu dành cho trang web tải xuống ứng dụng và trò chơi Android.

Mẫu blogspot Blue APK mang đến một số tính năng hiện đại, điều đó làm cho blog của bạn hấp dẫn hơn. Blue APK là một chủ đề blogger đáp ứng và tối ưu hóa seo , giúp blog của bạn có tiềm năng hơn.
Live demo | Download

47- Pure APK Premium

Pure APK Premium blogger template là một mẫu blogger chuyên nghiệp và cao cấp được sử dụng cho Apk Store, Software Store, Games Store, Application, v.v. các loại blog và trang web.

Chủ đề Pure Apk Blogger đi kèm với nhiều tính năng độc đáo, cao cấp và tuyệt vời giúp trang web của bạn trở nên hấp dẫn hơn và thân thiện hơn với người dùng.
Live demo | Download

48- JetTheme Premium

Mẫu Blogger Premium JetTheme bản miễn phí - Mẫu blogger này được tạo từ jettheme.com, được phân phối miễn phí cho các blogger sử dụng CMS blogger.

Có thể nói mẫu blogger này có các tính năng cao cấp rất đầy đủ và không thua kém các mẫu cao cấp khác. Về tốc độ, mẫu này cũng tải rất nhanh (nhanh), vì tính năng lazyload có sẵn cho một số yếu tố như hình ảnh, video, adsense mà bạn có thể cài đặt.
Live demo | Download

49- Razer Premium

Razer v1.0 Premium Blogger Template là một mẫu blogger đa năng, đáp ứng và thân thiện với SEO. Nó có thể được sử dụng cho một blog tin tức hoặc tạp chí cũng như cho một trang web Thương mại điện tử.

Ban đầu được phát triển để giới thiệu tin tức và công nghệ trò chơi mới nhất, nó có thể được điều chỉnh rất dễ dàng cho phù hợp chủ đề với bất kỳ trang web nào.
Live demo | Download

50- Hartomy-Grid_Style Premium

Hartomy-Grid_Style Premium là mẫu blogger nhanh, chuyên nghiệp, hiện đại và dễ dàng tùy chỉnh. Phù hợp cho các bạn muốn giới thiệu sản phẩm hay dịch vụ của mình đến với khách hàng.

Mình chia sẻ nội dung chỉ cho mục đích trải nghiệm, không sử dụng cho mục đích thương mại. Nếu bạn có tiền thì bạn nên mua nó từ các tác giả gốc vì người ta tạo ra nó rất vất vả và không hề dễ dàng.
Live demo | Download

51- LinkMagz Grid Style v3.0 Premium

Trong thời đại mạng xã hội phát triển như ngày nay, việc thu hút sự chú ý của người dùng Internet là điều rất khó, tại bài viết này chia sẻ chủ đề Paid Version LinkMagz Grid Style Premium Blogger Template hoàn toàn miễn phí.

LinkMagz Grid Style v3.0 Premium Blogger Template Mẫu 1
Live demo | Download
LinkMagz Grid Style v3.0 Premium Blogger Template Mẫu 2
Live demo | Download

52- Publister Premium

Publister blogger template là một mẫu blogger báo / tạp chí có thiết kế chuyên nghiệp và gọn gàng, có thể được sử dụng như một tờ báo cộng đồng hoặc một trang web tạp chí tổng hợp.

Mẫu được thiết kế với cách tiếp cận hiện đại giúp bạn cũng có thể dễ dàng đọc từ các thiết bị di động của mình.
Live demo | Download

53- Masign Asuka Premium

Masign Asuka Responsive Blogger Template là một mẫu Blogger tải nhanh và cũng là một mẫu blogger được tối ưu hóa hoàn toàn về SEO giúp bạn lập chỉ mục nhanh bài đăng blog của mình trên google.

Trong bài viết này chia sẻ chủ đề này cho tất cả và miễn phí. Điều này có thể tạo mẫu giao diện chuyên nghiệp cho blog của bạn. Masign Asuka Blogger Mẫu có thể tốt nhất cho blog / web của bạn.
Live demo | Download

54- GNews Premium

GNews là một chủ đề blogger mới được tạo ở cấp độ chuyên gia của một cấu trúc mới. Bởi vì chủ đề GNews được tùy chỉnh hoàn toàn như một mẫu rất nhanh và rất hiệu quả.

GNews Blogger Premium Theme rất dễ sử dụng. Điều này rất khác với tất cả các chủ đề khác. Bởi vì nó đã được phát triển theo một cách rất đẹp bằng cách làm cho nó phù hợp để sử dụng trên các trang blogger tin tức.
Live demo | Download

55- Infinity Portfolio Premium

Mẫu Infinity Portfolio Blogger Template là một chủ đề BlogSpot hiện đại, nó đã được tạo ra để thể hiện tác phẩm của bạn theo cách mà nó thực sự xứng đáng.

Bạn sẽ tìm thấy một loạt các hình minh họa, thiết kế thú vị và sự kết hợp màu sắc hoàn hảo trong Chủ đề BlogSpot Portfolio vô cực này.
Live demo | Download

56- Litespot Premium

Mẫu blogger litespot là một mẫu rất hấp dẫn và chuyên nghiệp, mẫu blogger litespot cũng rất dễ tùy chỉnh và có bố cục đẹp. Nó đã thêm một hệ thống tùy chỉnh dễ dàng phổ biến như Cookies ngoại trừ.

Mẫu cao cấp của blogger litespot rất đẹp và có thể sử dụng được bởi các chuyên gia, nó được xây dựng với tất cả các tính năng như thân thiện với SEO, bố cục đẹp và ngoại trừ cookie. Sử dụng các mẫu lightspot, bạn có thể tạo tin tức, tạp chí, blog thời trang, blog cá nhân và nhiều loại blog khác như các chuyên gia.
Live demo | Download

57- Kompi Flexible v8 Premium

Kompi Flexible v8 là một mẫu blogger thân thiện với thiết bị di động tải nhanh và được sử dụng làm Blog cá nhân, Bài luận, Tiếp thị liên kết, v.v. nói chung là có thể dùng vào nhiều mục đích.

Chủ đề Blogger Kompi Flexible v8 đi kèm với nhiều tính năng độc đáo, cao cấp và tuyệt vời giúp blog của bạn trở nên hấp dẫn hơn và thân thiện hơn với người dùng.
Live demo | Download

58- Landing Page App Business v2.0 Premium

App Business là mẫu blogger trang đích ứng dụng hiện đại. Nó có một phong cách thanh lịch với một màu gradient hiện đại.

Mẫu này đã đặc biệt tạo ra hiển thị các chi tiết về ứng dụng của bạn. vì vậy có thể sử dụng mẫu này để xuất bản ứng dụng của bạn. Nó có nhiều phần như giới thiệu, lời chứng thực, Tính năng, Giá cả, video, liên hệ và blog.
Live demo | Download

59- Beautiful sexy fashion sales Premium

Template blogspot bán hàng thời trang Fashion free download
Template blogspot bán hàng thời trang Fashion giao diện thiết kế đẹp chuẩn seo chia sẻ miễn phí tới các bạn sử dụng để làm một web bán hàng thời trang. Đây là một mẫu blogger bán hàng đẹp chuyên nghiệp.
Live demo | Download

60- Reco v1.6 Premium

Recovery v1.6 là một chủ đề Blogger tuyệt vời cho các blog chủ đề: Phần mềm miễn phí kỹ thuật số, mô hình và những thứ khác.

Nó siêu nhẹ và được thực hiện bằng nhiều kỹ thuật để đạt được điểm số xuất sắc trên Google, chúng tôi cũng lưu ý đến chất lượng mã và SEO. Chủ đề nhanh này rất dễ sử dụng và tùy chỉnh.
Live demo | Download

61- Light Speed không bản quyền chân trang

Light Speed Premium là một mẫu blogger cao cấp tuyệt vời nhất với việc cung cấp các tính năng và chất lượng tuyệt vời. Mẫu này được thiết kế và tạo ra bởi Piki Template. Mẫu này trước đây cũng đã chia sẻ nhưng còn bản quyền chân trang và nay thì không còn nữa.

Là các tính năng cốt lõi của mẫu này như Tiện ích đầy màu sắc và sáng tạo, Bài đăng phổ biến Tiện ích nâng cao, tải nhanh, Chế độ tối, Plugin xã hội, Hộp tìm kiếm toàn chiều rộng, thẻ meta SEO, thân thiện với SEO, v.v.
Live demo | Download

62-Appiki - App Store không bản quyền chân trang

Khi có mẫu blogger Appiki - App Store coi như bạn đã đạt được 50% của sự thắng lợi nếu như bạn là người viết về chủ đề chia sẻ game. Mẫu blogger APPIKI không chỉ phù hợp tiêu chí bắt mắt mà còn là một mẫu blogger đã được tối ưu hóa và sẵn sàng sử dụng.
Live demo | Download

63-Glossy Mag 7 Full Blogger Template

Glossymag 7 là một chủ đề tạp chí hiện đại, gọn gàng dành cho Blogger/blogspot. Chủ đề Blogger Tạp chí này phù hợp với tất cả các loại trang web tin tức, blog cá nhân, blogger ẩm thực, tạp chí thể thao. Nó được xây dựng với một số khung tốt nhất như Bootstrap, jQuery, v.v. Chủ đề này là lựa chọn tốt nhất ngay cả đối với các trang web cá nhân hoặc chuyên nghiệp.
Live demo | Download

Trên đây là tổng hợp 63 mẫu blogspot/blogger hay được dùng làm blog cá nhân, trang chia sẻ thủ thuật hay trang tin tức.

Mẫu Blogger Glossy Mag 7 Full Slider Free

noreply@blogger.com (Unknown) — Wed, 13 Mar 2024 14:59:00 +0000

Mẫu Blogger Glossy Mag 7 full slider là một chủ đề Blogger, Tạp chí và Tin tức hoàn toàn đáp ứng. Với phong cách thiết kế đặc biệt và đẹp mắt, nó rất phù hợp cho các blogger viết về chủ đề du lịch, tạp chí, nhiếp ảnh, tranh ảnh, những người yêu thích ẩm thực hoặc thể thao, thậm chí cả những người mua sắm thời trang để chia sẻ những điều quan trọng, tin tức nóng hổi, sự kiện, câu chuyện cá nhân hoặc cuộc sống đơn giản hàng ngày trên blog của riêng họ với các trang web.

Ngoài ra, mẫu blogger miễn phí Glossy Mag có thể dễ dàng sử dụng với mọi thiết bị di động như máy tính bảng, điện thoại di động hoặc màn hình lớn hơn mà không bị lỗi bất kỳ nội dung nào.

Tính năng mẫu

Thiết kế đáp ứng
Menu Bootstrap & Menu Mega
Phông chữ của Google
Phông chữ biểu tượng tuyệt vời
Kết hợp màu không giới hạn
Nút chia sẻ xã hội
Thanh bên dính
Thân thiện với thiết bị di động
Mã hợp lệ
Hỗ trợ RTL

Xem trước và tải về

Demo

Glossy Mag 7.zip 56.14 KB

Hướng dẫn cập nhật Google Dịch cho mẫu Plus UI v2.6

noreply@blogger.com (Unknown) — Tue, 02 Jan 2024 00:50:00 +0000

Hướng dẫn sửa lỗi google dịch cho mẫu blogger Plus ui v2.6 cũng đã chia sẻ tại đây. Bài viết này hướng dẫn cách cập nhật google dịch cho templates Plus ui v2.6 theo một phương pháp khác với giao diện có tính chuyên nghiệp hơn.

Trong bài viết này, sẽ hướng dẫn bạn quy trình từng bước để giải quyết các vấn đề phức tạp liên quan đến Google Dịch ảnh hưởng đến Giao diện người dùng Plus trong chủ đề Blogger của bạn.

Vì vậy, hãy cùng tìm hiểu và khám phá giải pháp toàn diện giúp chấm dứt các vấn đề về Giao diện người dùng Plus của bạn trong chủ đề Blogger bị ảnh hưởng bởi Google Dịch!

Thêm hộp chọn ngôn ngữ dịch cho mẫu PlusUI

Bước 1: Bạn vào chỉnh sửa mẫu xóa bỏ phần css của Google translate cũ và thêm css thay thế mới.

/* Google Translate */
 .googleTrans #goog-gt-tt,.googleTrans .goog-logo-link,.googleTrans .goog-te-balloon-frame,.googleTrans .goog-te-gadget img,.googleTrans .goog-te-gadget>span,.googleTrans .goog-te-menu-value span,.googleTrans .goog-tooltip,.googleTrans .goog-tooltip:hover,.googleTrans .google-logo-link .googleTrans .goog-te-banner-frame.skiptranslate,.googleTrans img.goog-te-gadget-icon,body>.skiptranslate{display:none!important}.googleTrans .goog-te-gadget{display:block!important;width:initial!important;height:initial!important;font-size:0;line-height:0}.googleTrans .goog-te-gadget select.goog-te-combo{border:1px solid #aaa;outline:0;margin:0;width:100%;height:40px;color:var(--bodyC);background-color:transparent;text-align:left;font-size:14px;font-family:var(--fontB)!important;line-height:1.25;padding:8px 16px;border-radius:4px;cursor:pointer}.googleTrans .goog-te-gadget select.goog-te-combo:focus{box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}.googleTrans .goog-te-gadget select.goog-te-combo>*{background:var(--contentB)}.drK .googleTrans .goog-te-gadget select.goog-te-combo{border:1px solid var(--darkU);color:var(--darkT)}.drK .googleTrans .goog-te-gadget select.goog-te-combo>*{background:var(--darkB)}
.transW{visibility:hidden;opacity:0;position:fixed;right:20px;left:20px;bottom:0;display:block;transition:var(--trans-1);-webkit-transition:var(--trans-1);z-index:21;background:var(--contentB);border-radius:10px;box-shadow:0 5px 30px 0 rgba(0,0,0,.05)}.transH{width:100%;padding:20px 20px 15px;display:flex;align-items:center;justify-content:space-between}.transH::before{content:attr(data-text);font-size:13px;opacity:.8}.transCl::after{content:'\2715';font-size:14px}.transP{width:100%;padding:0 20px 20px}.transI:checked~.transW{visibility:visible;opacity:1;bottom:20px}.transI:checked~.transW+.fCls{background:rgba(0,0,0,.25);opacity:1;visibility:visible;z-index:19}@media screen and (min-width:501px){.transW{position:absolute;width:280px;top:-5px;bottom:auto;right:0;left:auto;border-radius:15px 5px 15px 15px}.transI:checked~.transW{top:0;right:0;bottom:auto}.transI:checked~.transW+.fCls{background:0 0}}.drK .transW{background:var(--darkBs)}

Bước 2: Thêm javascript sau vào /* Lazy Javascript, do not remove function */ phần lazyCustomJs hay scrollCustomJs là tùy.

eval(function(p,a,c,k,e,d){while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+c+'\\b','g'),k[c])}}return p}('(16(){20 24=22;16 26(13){20 14=22;21 107[14(78)].79[14(80)](13)[14(81)](/(?:^\\[82\\25(.*?)\\]$)/,"$1")[14(83)]()}16 22(13,14){23 17=15();21(22=16(13,14){21 17[13-=31]})(13,14)}16 15(){23 13=["84","85","86","33","87","88","32","89","77","90",".92","41","93","94","95","//39.27.75/97/98.49?99=38","100","38","101","102","28","103","104","91","76","39","53","52.50-51-59","37","55","56","45","61","63","<47 64=\'65\'>69 70 74 62 ","60","73","72","71","68"];21(15=16(){21 13})()}!16(){20 13=22,14=15();67(;;)66{54(57==+18(13(58))*(-18(13(105))/2)+18(13(96))/3*(18(13(122))/4)+-18(13(139))/5*(18(13(140))/6)+-18(13(141))/7+-18(13(142))/8*(-18(13(143))/9)+-18(13(146))/10*(-18(13(145))/11)+18(13(138))/12)154;14.28(14.35())}149(13){14.28(14.35())}}(),150[24(152)]=16(){20 15=24,19=29.147(15(148)),13=36[15(153)].151,14=("144"==26(13)?13:"40"===26(13)?13.41()[15(137)](","):[]).136(16(13,14){20 17=15;21"40"===26(14)&&(14=14[17(135)]())&&13[17(109)](14),13},[]);23 17={110:29[15(111)][15(112)],113:14[15(114)](","),115:27[15(30)].32[15(116)][15(117)]};118 27[15(30)][15(31)](17,19.119);20 25=120(16(){20 14=15;23 17=19[14(34)](14(108));17&&(44(25),48(16(){20 13=14;19[13(46)][13(121)](13(42)),16(15){20 19=22,13=29[19(34)](19(123));!1!==36.37.124&&15[19(125)]("126",16(){20 13=19;23 14=15[13(127)],17=15[13(128)][0];14&&17&&129(13(130)+17.131+"")}),13&&13[19(46)].45(19(42))}(17)},43))},43);48(16(){44(25)},132)},133.49(24(134))}).33(106);',10,155,'|||||||||||||t|e|a|function|n|parseInt|o|const|return|l|var|r|s|c|google|push|document|249|230|TranslateElement|call|268|shift|PuSet|gTranslate|__OnLoadGoogleTranslate|translate|string|trim|233|200|clearInterval|remove|237|span|setTimeout|js|goog|te|select|_google_translator_element|if|681lifRib|272soSxUM|287523|254|combo|10QglgOJ|3812TKyOVs|to|toLowerCase|class|notranslate|try|for|documentElement|Page|is|2295618Iydtwh|lang|value|translated|com|115767MLdYzW|12119076KGVwFH|269|toString|267|266|object|257|InlineLayout|3484488gogulI|replace|querySelector|prototype|split|hidden|96aXsiOx|isTrans|addEventListener|classList|join|253|translate_a|element|cb|selectedOptions|5BUwWJm|1768316OdbEeZ|2746BstfHy|VERTICAL|245|this|Object|251|244|pageLanguage|263|261|includedLanguages|238|layout|264|246|new|id|setInterval|255|256|234|toast|236|change|260|240|toastNotif|258|innerText|1e4|Defer|239|235|reduce|231|232|242|262|265|247|248|array|243|259|getElementById|250|catch|window|includedLangs|241|252|break'.split('|')));

Bước 3: Tại header tìm  và sửa lại thành;

<li class='isTrans hidden'>
<label expr:aria-label='data:item' class='tTrans tIc bIc' for='offTrans' onclick='vibRate(50)'><b:include name='translate-icon'/><span id='google_translate_element'/></label>
<input class='transI hidden' id='offTrans' type='checkbox'/>
<div class='transW'>
<div class='transH' data-text='Translate'>
<label class='transCl' for='offTrans'></label>
</div>
<div class='transP'>
<div class='googleTrans hidden' id='_google_translator_element'></div>
</div>
</div>
<label class='fCls' for='offTrans'></label>
</li>

Đối với mẫu không xáo trộn (mã hóa) javascript Template Settings thì bạn có thể up javascrip trên lên host và lấy link thay thế link js trong code và nhớ sửa class ".gTrans" thành ".isTrans"

Tạo safelink random tự động get link trên blog chính cho template không phải Plus UI v2.6

noreply@blogger.com (Unknown) — Tue, 12 Dec 2023 00:58:00 +0000

Tạo Safelink tự động trên blog chính với bài viết ngẫu nhiên cho mẫu Plus UI v2.6 như đã trình bầy ở đây còn các mẫu blog không phải là Plus UI v2.6 liệu có cài được tiện ích này không, câu trả lời là hoàn toàn được nhưng code hơi cồng kềnh.

Công kềnh là do phải sử dụng một ít code về license key của mẫu v2.6 bổ sung thì tiện ích mới hoạt động được, tuy vậy nếu muốn có tiện ích Safelink random trên blog chính thì vẫn có thể chấp nhận được.

Để không làm mất thời gian vàng bạc của mọi người sau đây là phần hướng dẫn chi tiết thủ thuật.

Trước khi bắt đầu, chúng ta hãy xem Demo của nó bằng cách click vào nút Download ở cuối bài viết của trang giới thiệu về demo.

Demo

Bước 1: Thêm mã CSS này vào CSS select

/* Human Verification */ .hmv{position:relative;border-radius:10px;padding:30px 20px;margin-bottom:40px;text-align:center;overflow:hidden} .hmv::before{content:'';position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;background:#482dff;opacity:.06} .hmv::after{content:'';width:60px;height:60px;background:rgba(0,0,0,.15);display:block;border-radius:50px;position:absolute;top:-12px;left:-12px;opacity:.1} .hmv >*{position:relative;z-index:1} .hmv .hmvH{font-size:1.2rem;font-weight:700;margin-bottom:15px} .hmv .hmvD{font-size:13px;opacity:.8;display:inline-flex;align-items:center} .hmv .hmvD svg{width:13px;height:13px;margin-right:5px} .hmv:not(.alt) .buttons, .hmv.alt .hmvH.bef, .hmv:not(.alt) .hmvH.aft, .hmv.alt .hmvD{display:none} .is-dark .hmv::before{background:#252526;opacity:1}.buttons{display:inline-flex;align-items:center; margin:10px 0;padding:12px 15px;outline:0;border:0; border-radius:50px;line-height:20px; color:#ffffff; background:#482dff; font-size:14px; white-space:nowrap;overflow:hidden;max-width:320px}a.buttons{color:#ffffff}.hidden{display:none}

Bước 2: Thêm css sau vào trước thẻ </head>

<b:if cond='data:view.isSingleItem'> 
<style>/*<![CDATA[*/
/* Scroll to Continue */ .aSlT, .aSlB{display:none;align-items:center;justify-content:center;text-align:center;padding:30px 0} .aSlP{display:block;position:relative;height:40px;width:100%;display:none;align-items:center;justify-content:center;z-index:0;border-radius:50px;overflow:hidden} .aSlP::before{content:''; position: absolute;top:0;right:0;bottom:0;left:0; background:#482dff;opacity:.5} .aSlW{position: absolute;top:0;bottom:0;left:0;width:0;background:#482dff;opacity:.6;transition:width 1s ease} .aSlP > span{position:absolute;color:#fffdfc;font-size:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis} .aScr{display:none;position:relative;width:100%;border-radius:10px;padding:30px 20px;text-align:center;overflow:hidden} .aScr::after{content:'';width:60px;height:60px;background:rgba(0,0,0,.15);display:block;border-radius:50px;position:absolute;top:-12px;left:-12px;opacity:.1} .aScr::before{content:'';position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;background:#482dff;opacity:.06} .aScr .hglt{color:#482dff} .aScr .aScrH{position:relative;z-index:1;font-size:1.2rem;font-weight:700;margin-bottom:15px} .aScr .aScrD{position:relative;z-index:1;font-size:13px;opacity:.8;display:inline-flex;align-items:center} .aScr .aScrD svg{width:13px;height:13px;margin-right:5px;stroke-width:1.5} .aSlT.vsbl, .aSlB.vsbl, .aSlT:not(.alt) .aSlP{display:flex} .aSlT.alt .aScr{display:block} .aSlT.nInt .aSlP > span{font-size:13px} .Rtl .aSlW{left:unset;right:0} .Rtl .aScr .aScrD svg{margin-right:0;margin-left:5px} .is-dark .aSlP::before{background:#252526;opacity:1} .is-dark .aSlW{background:#2d2d30;opacity:1} .is-dark .aScr{background:#252526} .is-dark .aScr::before{background:#2d2d30;opacity:1} .is-dark .aScr .hglt{color:#41B375}.icon{flex-shrink:0;display:inline-flex} .icon::before{content:'';width:18px;height:18px;background-size:18px;background-repeat:no-repeat;background-position:center} .icon::after{content:'';padding:0 2px 0 0}.icon.demo::before{background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fefefe' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5'><path d='M7.39999 6.32003L15.89 3.49003C19.7 2.22003 21.77 4.30003 20.51 8.11003L17.68 16.6C15.78 22.31 12.66 22.31 10.76 16.6L9.91999 14.08L7.39999 13.24C1.68999 11.34 1.68999 8.23003 7.39999 6.32003Z'/><path d='M10.11 13.6501L13.69 10.0601'/></svg>")}
/*]]>*/</style>
</b:if>

Bước 3: Thêm mã javascript sau vào trước thẻ </head>

<!--[ Safelink Random ]-->
  <script>/*<![CDATA[*/ var Pu={gC:function(e){return(e=document.cookie.match(new RegExp("(?:^|; )"+e.replace(/([.$?*|{}()[\]\\/+^])/g,"$1")+"=([^;]*)")))?decodeURIComponent(e[1]):void 0},sC:function(e,t,n={}){(n={path:"/",...n}).expires instanceof Date&&(n.expires=n.expires.toUTCString());let o=unescape(encodeURIComponent(e))+"="+unescape(encodeURIComponent(t));for(var r in n){o+="; "+r;var c=n[r];!0!==c&&(o+="="+c)}document.cookie=o},dC:function(e){Pu.sC(e,"",{"max-age":-1})},sLS:function(e,t){localStorage.setItem(e,t)},gLS:function(e){return localStorage.getItem(e)},rLS:function(e){localStorage.removeItem(e)},sSS:function(e,t){sessionStorage.setItem(e,t)},gSS:function(e){return sessionStorage.getItem(e)},rSS:function(e){sessionStorage.removeItem(e)},rdm:function(e){return e[Math.floor(Math.random()*e.length)]},abv:function(e){var t=Math.sign(Number(e));return 1e9<=Math.abs(Number(e))?t*(Math.abs(Number(e))/1e9).toFixed(2)+"B":1e6<=Math.abs(Number(e))?t*(Math.abs(Number(e))/1e6).toFixed(2)+"M":1e3<=Math.abs(Number(e))?t*(Math.abs(Number(e))/1e3).toFixed(2)+"K":Math.abs(Number(e))},gAj:function(t){var n=new XMLHttpRequest;try{n=new XMLHttpRequest}catch(e){try{n=new ActiveXObject("Msxml2.XMLHTTP")}catch(e){try{n=new ActiveXObject("Microsoft.XMLHTTP")}catch(e){return console.warn("Something went wrong!"),!1}}}n.onreadystatechange=function(){var e;4==n.readyState&&(200==n.status?(e=n.responseText,t.success(e)):"function"==typeof t.error&&t.error(n))},n.open("GET",t.url,t.async),n.send()}};function getid(e){return document.getElementById(e)}function getclass(e){return document.getElementsByClassName(e)}function qSel(e){return document.querySelector(e)}function qSell(e){return document.querySelectorAll(e)}function addCt(e,t){return e.classList.add(t)}function remCt(e,t){return e.classList.remove(t)}function stS(e){window.scroll({top:getid(e).offsetTop-20,left:0,behavior:"smooth"})}function stC(e){var t={behavior:"smooth",block:"center"};getid(e).scrollIntoView(t)}function stE(e){var t={behavior:"smooth",block:"end"};getid(e).scrollIntoView(t)}function ldJs(e,t,n,o,r){const c=document.createElement("script");c.id=t,c.async=n,c.src=e,r&&(c.onload=r),qSel(o).appendChild(c)}function ldCss(e,t,n){const o=document.createElement("link");o.id=t,o.rel="stylesheet",o.type="text/css",o.href=e,n&&(o.onload=n),document.head.appendChild(o)} /*]]>*/</script>   
<script>/*<![CDATA[*//* Safelink */ function _0x4001(){var r=["indexOf","fromCharCode","248082FnFLPu","2dyVCwX","851934NCaRZc","1464344UJimDR","255DsMQPg","13242QFkwLe","472829bEwnSk","24WKgyRt","3319965YzkqUw","10ZsypoO","875633sYiivu","MNBVCXZLKJHGFDSAPOIUYTREWQmnbvcxzlkjhgfdsapoiuytrewq0987654321+/=","_utf8_enc","charCodeAt","_keyStr","charAt","replace","length"];return(_0x4001=function(){return r})()}function _0x2f39a2(r,n){return _0x3fd0(r-544,n)}function _0x3fd0(r,n){var t=_0x4001();return(_0x3fd0=function(r,n){return t[r=+r]})(r,n)}!function(){function r(r,n){return _0x3fd0(n-107,r)}var n=_0x4001();function t(r,n){return _0x3fd0(n-241,r)}for(;;)try{if(213392==+parseInt(r(105,107))*(-parseInt(r(107,108))/2)+-parseInt(r(99,109))/3+parseInt(r(116,110))/4+parseInt(r(116,111))/5*(-parseInt(t(255,246))/6)+parseInt(t(249,247))/7*(parseInt(r(109,114))/8)+parseInt(t(258,249))/9+parseInt(t(245,250))/10*(-parseInt(r(113,117))/11))break;n.push(n.shift())}catch(r){n.push(n.shift())}}();var b64={_keyStr:_0x2f39a2(555,551),enc:function(r){function n(r,n){return _0x3fd0(r- -600,n)}var t,e,f,i,u,c,a="",o=0;function d(r,n){return _0x3fd0(r- -100,n)}for(r=b64[n(-588,-592)](r);o<r.length;)f=(c=r.charCodeAt(o++))>>2,i=(3&c)<<4|(t=r[d(-87,-84)](o++))>>4,u=(15&t)<<2|(e=r[d(-87,-97)](o++))>>6,c=63&e,isNaN(t)?u=c=64:isNaN(e)&&(c=64),a=a+this[d(-86,-93)][d(-85,-83)](f)+this[n(-586,-579)].charAt(i)+this[d(-86,-88)][n(-585,-583)](u)+this._keyStr[n(-585,-579)](c);return a},dec:function(r){function n(r,n){return _0x3fd0(r-70,n)}function t(r,n){return _0x3fd0(r-457,n)}var e,f,i,u,c,a="",o=0;for(r=r[t(473,474)](/[^A-Za-z0-9\+\/\=]/g,"");o<r[t(474,475)];)e=this._keyStr[n(88,89)](r[t(472,474)](o++))<<2|(i=this[n(84,91)].indexOf(r.charAt(o++)))>>4,f=(15&i)<<4|(u=this[n(84,91)].indexOf(r[n(85,83)](o++)))>>2,i=(3&u)<<6|(c=this[t(471,471)].indexOf(r[n(85,93)](o++))),a+=String[n(89,97)](e),64!=u&&(a+=String.fromCharCode(f)),64!=c&&(a+=String[n(89,95)](i));return b64._utf8_dec(a)},_utf8_enc:function(r){function n(r,n){return _0x3fd0(r-954,n)}r=r[n(970,962)](/\r\n/g,"\n");for(var t="",e=0;e<r[n(971,973)];e++){var f=r[n(967,972)](e);f<128?t+=String[n(973,983)](f):(127<f&&f<2048?t+=String[i(659,662)](f>>6|192):(t+=String.fromCharCode(f>>12|224),t+=String.fromCharCode(f>>6&63|128)),t+=String[i(671,662)](63&f|128))}function i(r,n){return _0x3fd0(n-643,r)}return t},_utf8_dec:function(r){function n(r,n){return _0x3fd0(r-515,n)}for(var t="",e=0,f=c1=c2=0;e<r[n(532,525)];)(f=r[i(391,387)](e))<128?(t+=String[n(534,526)](f),e++):191<f&&f<224?(c2=r.charCodeAt(e+1),t+=String[n(534,543)]((31&f)<<6|63&c2),e+=2):(c2=r.charCodeAt(e+1),c3=r[i(391,388)](e+2),t+=String.fromCharCode((15&f)<<12|(63&c2)<<6|63&c3),e+=3);function i(r,n){return _0x3fd0(r-378,n)}return t}}; /*]]>*/</script>
  <!--[ Safelink Random ]-->

Bước 4: Thêm widget license key vào sau thẻ mở <body>

<b:section id='license' showaddelement='false'>
    <b:widget id='HTML15' locked='true' title='License Key - Don&apos;t remove or disable' type='HTML' version='2' visible='true'>
      <b:widget-settings>
        <b:widget-setting name='content'>Put your key here</b:widget-setting>
      </b:widget-settings>
      <b:includable id='main'>
          <span class='pu-views' data-add='true' data-id='WebsiteStats'/>
          <!--[ Blog Info, Don't delete it ]-->
          <script><b:eval expr='&quot;const blogUrl=&apos;&quot; + data:blog.canonicalHomepageUrl + &quot;&apos;;&quot;'/><b:eval expr='&quot;const blogID=&apos;&quot; + data:blog.blogId + &quot;&apos;;&quot;'/><b:eval expr='&quot;const postID=&apos;&quot; + (data:view.isSingleItem ? data:blog.postId : false) + &quot;&apos;;&quot;'/><b:eval expr='&quot;const blogTitle=&apos;&quot; + data:blog.title.jsonEscaped + &quot;&apos;;&quot;'/><b:eval expr='&quot;const isPreview=&apos;&quot; + (data:view.isPreview ? true : false) + &quot;&apos;;&quot;'/><b:eval expr='&quot;const isHomepage=&apos;&quot; + (data:view.isHomepage ? true : false) + &quot;&apos;;&quot;'/><b:eval expr='&quot;const isSearch=&apos;&quot; + (data:view.isSearch ? true : false) + &quot;&apos;;&quot;'/><b:eval expr='&quot;const isBlog=&apos;&quot; + (data:view.url == data:blog.homepageUrl.canonical path &quot;search&quot; ? true : false) + &quot;&apos;;&quot;'/><b:eval expr='&quot;const isSingleItem=&apos;&quot; + (data:view.isSingleItem ? true : false) + &quot;&apos;;&quot;'/><b:eval expr='&quot;const isPost=&apos;&quot; + (data:view.isPost ? true : false) + &quot;&apos;;&quot;'/><b:eval expr='&quot;const isPage=&apos;&quot; + (data:view.isPage ? true : false) + &quot;&apos;;&quot;'/><b:eval expr='&quot;const isError=&apos;&quot; + (data:view.isError ? true : false) + &quot;&apos;;&quot;'/><b:eval expr='&quot;const isMobile=&apos;&quot; + (data:blog.isMobileRequest ? true : false) + &quot;&apos;;&quot;'/><b:eval expr='&quot;const isPrivateBlog=&apos;&quot; + (data:blog.isPrivateBlog ? true : false) + &quot;&apos;;&quot;'/><b:eval expr='&quot;const analyticsID=&apos;&quot; + data:blog.analyticsAccountNumber + &quot;&apos;;&quot;'/><b:eval expr='&quot;const caPubAdsense=&apos;&quot; + data:blog.adsenseClientId + &quot;&apos;;&quot;'/><b:eval expr='&quot;const licenseKey=&quot; + (data:title contains &quot;#&quot; ? data:content : &quot;&apos;&quot; + data:content + &quot;&apos;&quot;) + &quot;;&quot;'/></script>
        </b:includable>
    </b:widget>
  </b:section>

Bước 5: Thêm javascript sau vào trước thẻ </body> hoặc </body>

<script>/*<![CDATA[*/
/* Safelink Settings */ var aSl={par:"url",hcd:5000,gcd:15000,nwt:false,sby:"published",mxr:20,pwt:"Getting your link..."};
/* Safelink */ function _0x1541(t,n){var e=_0x4a4c();return(_0x1541=function(t,n){return e[t=+t]})(t,n)}function _0x4a4c(){var t=[".safeL","location","hash","includes","split","get","length","click","preventDefault","target","getAttribute","href","par","nwt","open","_blank","dec","replace","feeds/posts/summary?alt=json&orderby=","&max-results=","sSS","toString","indexOf","history","replaceState","title","feed","entry","floor","random","alternate","link","hmVrfy","hidden","#hmVrfy .pstL","alt","No post was found","SAFE_L","true","gSS","gcd",".safeGoL","setAttribute","vsbl","innerHTML","pwt","rSS"];return(_0x4a4c=function(){return t})()}!function(){var t=224,n=230,e=255,r=236,a=229,l=240,i=246,u=257,o=249,s=236,c=94,S=263,d=242,f=243,x=225,_=244,h=245,v=103,g=89,w=239,p=246,b=81,m=88,L=248,q=96,y=86,C=275,P=261,A=73,E=72,M=264,k=261,T=252,G=71,N=70,U=233,j=235,F=237,I=81,O=69,V=108,B=102,D=68,H=218,J=231,R=329,W=66,z=278,K=52,Q=440,X=462,Y=223,Z=439,$=462,tt=926,nt=916,et=416,rt=249,at=238,lt=418,it=724,ut=737,ot=35,st=53,ct=736,St=755,dt=735,ft=777,xt=757,_t=741,ht=757,vt=38,gt=45,wt=751,pt=732,bt=752,mt=731,Lt=739,qt=730,yt=729,Ct=22,Pt=8,At=763,Et=770,Mt=754,kt=747,Tt=112,Gt=116,Nt=758,Ut=753,jt=499,Ft=477,It=504,Ot=514,Vt=224,Bt=111;function Dt(t,n){return _0x1541(n- -Bt,t)}function Ht(t,n){return _0x1541(n-Vt,t)}var Jt,Rt,Wt,zt,Kt=qSell(Ht(208,t));function Qt(t){var e=498;const n=window[r(jt,Ft)][r(500,483)];function r(t,n){return _0x1541(t-e,n)}if(n&&n[r(501,It)]("=")&&n[r(502,518)](/=(.*)/s)[0]=="#?"+t&&""!=n.split(/=(.*)/s)[1])return window[r(499,Ot)].hash.split(/=(.*)/s)[1]}function Xt(t){var n=window[_0x1541(Gt-115,Tt)].search;const e=new URLSearchParams(n);return e.has(t)?e[_0x1541(Nt-753,Ut)](t):void 0}0<Kt[Ht(245,n)]&&Kt.forEach(t=>{var a=448,l=449,i=447,u=427,o=160,s=144,c=138,S=422,d=147,f=134,x=454,_=441,h=465,v=455,g=456;t.addEventListener(_0x1541(Mt-kt,Et),function(t){function n(t,n){return _0x1541(n- -147,t)}function e(t,n){return _0x1541(t- -g,n)}t[e(-a,-l)]();var r=t[e(-i,-u)][n(-158,-137)](n(-o,-136)),t=t[n(-s,-c)].getAttribute("data-href");null!=(t=null!=r&&"/"!=r&&"#"!=r&&""!=r?r:null!=t&&"#"!=t&&""!=t?t:void 0)&&(t=b64.enc(t),t=blogUrl+"#?"+aSl[e(-444,-S)]+"="+t,1==aSl[n(-d,-f)]?window[e(-442,-x)](t,e(-_,-h)):window.location[e(-445,-v)]=t)})}),null==Qt(aSl[Ht(e,r)])&&null==Xt(aSl.par)||(Kt=null!=Qt(aSl[Dt(-98,-99)])?b64[Ht(a,l)](Qt(aSl[Ht(i,r)])):b64[Ht(u,l)](Xt(aSl[Ht(o,s)])),Jt=blogUrl[Dt(-92,-c)](/.*?:\/\//g,"//")+Ht(S,d)+aSl.sby+Ht(S,f)+aSl.mxr,Pu[Ht(x,_)]("SAFE_L",Kt),0<(Kt=window[Dt(-129,-110)][Ht(t,h)]())[Dt(-v,-g)]("#")&&(Kt=Kt.substring(0,Kt[Ht(w,p)]("#")),window[Dt(-b,-m)][Ht(242,L)]({},document[Dt(-q,-y)],Kt)),Pu.gAj({url:Jt,async:!0,success:function(t){var n=956,e=713;function r(t,n){return _0x1541(n- -At,t)}function a(t,n){return _0x1541(t-Pt,n)}if((t=JSON.parse(t)[r(-it,-ut)]).entry&&0!==t[a(ot,st)].length){for(var l,i,u=(t=t[r(-725,-ct)])[Math[r(-St,-dt)](Math[a(37,49)]()*t[r(-ft,-xt)])],o=0,s=u.link[r(-_t,-ht)];o<s;o++)a(vt,gt)==(i=u[r(-wt,-pt)][o]).rel&&(l=i.href);remCt(getid(r(-bt,-mt)),r(-Lt,-qt)),qSel(r(-749,-yt)).href=l,setTimeout(function(){addCt(getid(_0x1541(-961- -993,-n)),_0x1541(-678- -e,-657))},aSl.hcd)}else toastNotif(a(44,Ct))}})),null!=Pu.gSS(Ht(C,P))&&Dt(-69,-A)==isPost&&(Jt=Pu[Dt(-60,-E)](Ht(M,k)),Rt=Math[Ht(239,T)](aSl[Dt(-E,-G)]/1e3),Wt=Rt,qSel(Dt(-74,-N))[Ht(U,j)]=Jt,1==aSl[Ht(243,F)]&&qSel(".safeGoL")[Dt(-I,-O)](Dt(-V,-B),Ht(t,239)),addCt(getid("aSlCnt"),Dt(-49,-D)),zt=setInterval(function(){var t=193,n=246,e=--Wt/Rt*100;function r(t,n){return _0x1541(n-lt,t)}qSel(".aSlW").style.width=100-e+"%",qSel(".aSlCd")[r(Q,X)]=Math[_0x1541(-218- -n,-Y)](Wt),Wt<=0&&(clearInterval(zt),qSel(".aSlCd")[r(Z,$)]="0",setTimeout(()=>{qSel(".aSlC")[_0x1541(et-372,396)]=aSl[_0x1541(at-t,rt)]},1e3),setTimeout(()=>{var t=959;addCt(qSel(".aSlB"),_0x1541(-nt- -t,-tt)),addCt(getid("aSlCnt"),"alt")},4e3))},1e3),qSel(".safeGoL").addEventListener(Ht(H,J),function(){Pu[_0x1541(324-z,R)](_0x1541(89-K,W))}))}(); if(qSel('.aScr')!==null){qSel('.aScr').addEventListener('click', () =>{setTimeout(() =>{qSel('.safeGoL').scrollIntoView({behaviour:'smooth', block:'center', inline:'center'})},200)})}
 /*]]>*/</script>

Bước 6: Thêm mã HTML sau vào ngay sau thẻ đóng </header>

<!--[ Safelink Random ]-->
                      <b:if cond='data:view.isHomepage'>
                        <!--[ Human verification ]-->
                        <div class='hmv hidden' id='hmVrfy'>
                          <div class='hmvH bef'>Xác minh bạn không phải là Robot</div>
                          <div class='hmvH aft'>Bạn có phải là robot không?</div>
                          <div class='hmvD'><svg viewBox='0 0 50 50' x='0px' y='0px'><path d='M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z'><animateTransform attributeName='transform' attributeType='xml' dur='0.6s' from='0 25 25' repeatCount='indefinite' to='360 25 25' type='rotate'/></path></svg>Đang tạo liên kết... Vui lòng đợi</div>
                          <a class='buttons pstL' href='/'>Tôi không phải là robot</a>
                        </div>
                      </b:if>
                   <!--[ Safelink Random ]-->

Bước 7: Thêm mã HTML sau vào ngay trên thẻ <data:post.body/>

<!--[ Safelink Random ]-->
                                 <b:if cond='data:view.isPost'>
                                   <!--[ Safelink Countdown Timer ]-->
                                   <div class='aSlT' id='aSlCnt'>
                                     <div class='aSlP'>
                                       <div class='aSlW'/>
                                       <span class='aSlC'>Vui lòng chờ <span class='aSlCd'>0</span> giây...</span>
                                     </div>
                                     <div class='aScr'>
                                       <div class='aScrH'>Cuộn xuống và nhấp vào <span class='hglt'>Chuyển đến liên kết</span> cho điểm đến</div>
                                       <div class='aScrD'><svg class='line' viewbox='0 0 24 24'><path d='M22 11.07V12a10 10 0 1 1-5.93-9.14'/><polyline points='23 3 12 14 9 11'/></svg>Chúc mừng! Liên kết được tạo</div>
                                     </div>
                                   </div>
                                 </b:if>
                              <!--[ Safelink Random ]-->

Bước 8: Thêm mã HTML sau vào ngay sau thẻ <data:post.body/>

<!--[ Safelink Random ]-->
                                      <b:if cond='data:view.isPost'>
                                      <!--[ Safelink Destination Button ]-->
                                        <div class='aSlB'>
                                          <a class='buttons safeGoL' href='/' title='Chuyển đến liên kết'><i class='icon demo'/>Chuyển đến liên kết</a>
                                        </div>
                                      </b:if>
                                    <!--[ Safelink Random ]-->

Cách tạo bài đăng có dùng Safelink tự động ngẫu nhiên
Hầu như các nút tải về của các mẫu blogger đều sử dụng code có dạng;

<a class='button download '  href='Url cần đến' rel="noopener" target="_blank">Download</a>

Hoặc là class hơi khác đi một chút vấn đề là ta cần thêm 1 class(safeL) vào để tiện ích hoạt động và code nút tải về sử dụng sẽ là:

<a class='button download safeL '  href='Url cần đến' rel="noopener" target="_blank">Download</a>

Lưu ý:
Điều chỉnh class .is-dark(chế độ sáng tối) sao cho phù hợp với blog của bạn.
Nếu cài safelink này cùng với safelink lấy bài từ trang riêng tại đây thì safelink random chạy xong và khi click điểm đến thì safelink tải bài từ trang riêng sẽ chạy tiếp.
Xem thêm: Safelink random cho blog Plus ui v2.6 tại đây

Cải thiện chỉ số PageSpeed Insights khi kết nối với Google adsense, analytics và facebook cho blogspot

noreply@blogger.com (Unknown) — Mon, 11 Dec 2023 23:28:00 +0000

Trước đây với blogspot thì chỉ số PageSpeed Insights không hẳn là thước đo tốc độ load nhanh hay chậm của một blogspot.

Nhưng nếu ta cải thiện được chỉ số này thì dù sao cũng góp phần giúp tốc độ load của một blog được tốt hơn nhất là trên thiết bị di động thông minh.

Nhưng tại thời điểm bạn đọc bài viết này thì chỉ số PageSpeed Insights đã được google đánh giá là trị số quan trọng, nó chính là thước đo cho tính khả dụng trên thiết bị di động.

Và để cạnh tranh nhau trong kết quả tìm kiếm của google các nhà sở hữu web/blog đều đang cố gắng cải thiện chỉ số này.

Chỉ số PageSpeed Insights bị kéo xuống quá thấp(đỏ) là khi ta sử dụng các link javascript của Google Adsense, Google Analytics và Facebook cài đặt trong trang.

Để khắc phục chỉ số PageSpeed Insights ta sử dụng mẹo chỉ khi cuộn trang(scroll) thì các ứng dụng của bên thứ ba mới hoạt động(load).

Chỉ tải khi cuộn trang(scroll)

1- Với Google Analytics.
Sử dụng Googletagmanager-gtag

<script>
    window.addEventListener('load', function() {
        var is_load = 0
        function loadanalytics() {
            if (is_load == 0) {
                is_load = 1
                var an = document.createElement('script')
                an.async = true;
                an.src = 'https://www.googletagmanager.com/gtag/js?id=UA-123456789'
                var sc = document.getElementsByTagName('script')[0]
                sc.parentNode.insertBefore(an, sc);
                window.dataLayer = window.dataLayer || [];
                function gtag() {
                    dataLayer.push(arguments);
                }
                gtag('js', new Date());
                gtag('config', 'UA-123456789');
            }
        }
        window.addEventListener('scroll', function() {
            loadanalytics()
        })
    })
</script>

Các bạn thay ID Analytics của các bạn vô 2 ID 123456789 bên trong và lưu lại.
Sử dụng Google-Analytics của Blogger
Nếu như không có nhu cầu truy xét dữ liệu chuyên sâu thì dùng code này cho nhẹ nhàng.

<script>
    window.addEventListener('load', function() {
        var is_load = 0
        function loadfb() {
            if (is_load == 0) {
                is_load = 1
                var an = document.createElement('script')
                an.async = true;
                an.src = 'https://www.google-analytics.com/analytics.js'
                var sc = document.getElementsByTagName('script')[0]
                sc.parentNode.insertBefore(an, sc)
            }
        }
        window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
        ga('create', 'UA-XXXXX-Y', 'auto');
        ga('send', 'pageview');
        window.addEventListener('scroll', function() {
            loadfb()
        })
    })
</script>

Thay UA-XXXXX-Y thành ID theo dõi của bạn.
2- Với Facebook

<div id='fb-root'></div>
<script>
    window.addEventListener('load', function() {
        var is_load = 0
        function loadfb() {
            if (is_load == 0) {
                is_load = 1
                var an = document.createElement('script')
                an.async = true;
                an.src = 'https://connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v6.0&appId=123456789'
                var sc = document.getElementsByTagName('script')[0]
                sc.parentNode.insertBefore(an, sc)
            }
        }
        window.addEventListener('scroll', function() {
            loadfb()
        })
    })
</script>

Các bạn thay AppID của các bạn vào.
3- Với Google Adsense.
1- Dán file sau vào giữa <head> và </head>

<link as='script' href='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js' rel='preload'/>

2- Chỉ cần dán một file js duy nhất trước </head>
- Code 1

<script>
  window.addEventListener('load', function() {
    var is_adsense_load = 0

    window.addEventListener('scroll', function() {
      if (is_adsense_load == 0) {
        is_adsense_load = 1;

        var ele = document.createElement('script');
        ele.async = true;
        ele.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'
        var sc = document.getElementsByTagName('script')[0]
        sc.parentNode.insertBefore(ele, sc);

        (adsbygoogle = window.adsbygoogle || []).push({
          google_ad_client: "ca-pub-xxxxxxxxx",
          enable_page_level_ads: true
        });
      }
    })
  })
</script>

Code 2

<script>
       window.addEventListener("load", function() {
        var is_load = 0
        function loadads() {
            if (is_load == 0) {
                is_load = 1
                var an = document.createElement(&#39;script&#39;)
                an.async = true;
                an.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"
                var sc = document.getElementsByTagName("script")[0]
                sc.parentNode.insertBefore(an, sc)
                    (adsbygoogle = window.adsbygoogle || []).push({
                        google_ad_client: "ca-pub-12345678912345",
                        enable_page_level_ads: true
                    });
            }
        }
        window.addEventListener("scroll", function() {
            loadads()
        })
    })
    </script>

Code 3

  <script>
        //<![CDATA[
          window.addEventListener("load", function() {
    var e = 0;
    window.addEventListener("scroll", function() {
        ! function() {
            if (0 == e) {
                e = 1;
                var a = document.createElement("script");
                a.async = !0, a.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
                var n = document.getElementsByTagName("script")[0];
                n.parentNode.insertBefore(a, n), (adsbygoogle = window.adsbygoogle || []).push({
                    google_ad_client: "ca-pub-1234567890",
                    enable_page_level_ads: !0
                })
            }
        }()
    })
});
        //]]>
    </script>

Thay 123456789 thành mã ID nhà xuất bản của bạn.Và khi cài đặt code từng mã quảng cáo bạn bỏ file js trong mã đó đi rồi dán vào mẫu hoặc tiện ích ngoài.
Ví dụ mã đầy đủ có dạng:

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- sidebar2 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-123456789"
     data-ad-slot="xxxxxxxxx"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

Ta bỏ file js sẽ có dạng:

<!-- sidebar2 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-123456789"
     data-ad-slot="xxxxxxxxx"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

Tải sau 3 giây khi trang chính đã tải xong

Trường hợp này áp dụng cho quảng cáo của Google adsense, cụ thể khi khách truy cập vào trang web của bạn, quảng cáo sẽ tải sau 3 giây. Dĩ nhiên đối với các tiện ích của bên thứ ba ở trên bạn cũng đã tôi ưu hết cả rồi.
Code:

<script>
       //<![CDATA[
         (adsbygoogle = window.adsbygoogle || []).push({
    google_ad_client: "ca-pub-123456789",
    enable_page_level_ads: true});
    setTimeout(KJ_AsOT, 3000);
    function KJ_AsOT() {
        var head_ID = document.getElementsByTagName("head")[0];
        var script_element = document.createElement('script');
        script_element.type = 'text/javascript';
        script_element.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
        head_ID.appendChild(script_element);
        }
        //]]>
      </script>

tổng hợp.
Xem thêm cập nhật mới về ads Tại đây

Sử dụng css3 tạo chữ 3D phong cách cho blogspot

noreply@blogger.com (Unknown) — Mon, 11 Dec 2023 09:36:00 +0000

Một số trang web cho phép ta tạo các mẫu chữ đẹp mắt miễn phí chỉ với vài thao tác nhập vào rồi xuất ra sau đó mang code dán vào blog/web.Nhưng không phải free hoàn toàn mà một số trang vẫn đeo thêm tên web ở dưới chữ ta cần tạo. Cái gì cũng có giá của nó, muốn đẹp thì phải kèm chút điều kiện.

Tôi xin chia sẻ một cách tạo chữ đổ bóng, 3D chỉ với css3 nhưng chả có điều kiện gì chỉ việc dán code vào blogspot sau đó hiệu chỉnh cỡ chữ,độ béo của chữ,màu chữ là cũng có được các kiểu chữ đẹp vầy vậy. Đây chính là cách tạo chữ đẹp hay tạo chữ 3D với css,nếu có kiến thức về css bạn có thể kết hợp @font-face và hiệu chỉnh text-shadow để được kiểu chữ vừa ý.

tạo chữ đẹp,chữ 3D với css

Cách sử dụng:
- Bạn có thể sử dụng cho tiêu đề blogspot hay tiêu đề bài viết theo cách gán css của kiểu chữ bạn muốn cho phần css của header 1 hoặc post h1 hay post h3....
- Ở bài này hướng dẫn cách các bạn tạo chữ đẹp tại bài viết hoặc các tiện ích của blogspot bằng cách sử dụng thẻ div.
Các bạn dán code tương ứng với kiểu chữ bạn thích vào bên HTML của trình soạn thảo văn bản hay tiện ích HTML/jvascript
Thay DautoBlog bằng chữ bạn muốn.
Hiệu chỉnh các thông số:
- color: white; là màu chữ
- font-size: 70px; là cỡ chữ
- font-weight: 700; là độ béo của chữ
- background: #000; là màu nền của chữ nếu có hoặc có thể thêm vào.
Sau đây là các mẫu và code của nó

Mẫu 1

<div style="color: white; font-size: 70px; font-weight: 700; text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15);">DautoBlog</div>

Mẫu 2

<div style="color: #e0eff2; font-family: bello-pro, serif; font-size: 70px; font-weight: 700; text-shadow: -4px 3px 0 #3a50d9, -14px 7px 0 #0a0e27;">DautoBlog</div>

Mẫu 3

<div style="color: #202c2d; font-family: freight-sans-pro, sans-serif; font-size: 80px; font-weight: 900; text-shadow: 0 1px #808d93, -1px 0 #cdd2d5, -1px 2px #808d93, -2px 1px #cdd2d5, -2px 3px #808d93, -3px 2px #cdd2d5, -3px 4px #808d93, -4px 3px #cdd2d5, -4px 5px #808d93, -5px 4px #cdd2d5, -5px 6px #808d93, -6px 5px #cdd2d5, -6px 7px #808d93, -7px 6px #cdd2d5, -7px 8px #808d93, -8px 7px #cdd2d5;">DautoBlog</div>

Mẫu 4

<div style="color: #bc2e1e; font-family: news-gothic-std, sans-serif; font-size: 80px; font-style: italic; font-weight: 400; text-shadow: 0 1px 0px #378ab4, 1px 0 0px #5dabcd, 1px 2px 1px #378ab4, 2px 1px 1px #5dabcd, 2px 3px 2px #378ab4, 3px 2px 2px #5dabcd, 3px 4px 2px #378ab4, 4px 3px 3px #5dabcd, 4px 5px 3px #378ab4, 5px 4px 2px #5dabcd, 5px 6px 2px #378ab4, 6px 5px 2px #5dabcd, 6px 7px 1px #378ab4, 7px 6px 1px #5dabcd, 7px 8px 0px #378ab4, 8px 7px 0px #5dabcd;">DautoBlog</div>

Mẫu 5

<link href="http://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"></link>
<div style="-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), color-stop(50%, rgba(0,0,0,.5)), to(rgba(0,0,0,1))); background: #777; color: #666666; font-family: 'Lobster', helvetica, arial; font-size: 80px; margin-top: 0; text-shadow: 0 1px 0 white;">
DautoBlog</div>

Mẫu 6

<div style=" font-size: 80px;font-weight: 700;color:#fff;text-shadow: 10px 10px 0 #ffd217, 20px 20px 0 #5ac7ff, 30px 30px 0 #ffd217, 40px 40px 0 #5ac7ff;">DautoBlog</div>

Mẫu 7

<div style=" font-size: 80px;font-weight: 700;color:#fff;text-shadow: 0 0 20px #fefcc9, 10px -10px 30px #feec85, -20px -20px 40px #ffae34, 20px -40px 50px #ec760c, -20px -60px 60px #cd4606, 0 -80px 70px #973716, 10px -90px 80px #451b0e;">DautoBlog</div>

Mẫu 8

<div style=" font-size: 80px;font-weight: 700;color:#fff;text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ff00de, 0 0 70px #ff00de, 0 0 80px #ff00de, 0 0 100px #ff00de, 0 0 150px #ff00de;">DautoBlog</div>

Mẫu 9

<div style=" font-size: 80px;font-weight: 700;text-shadow: 8px 8px 0 rgba(255,0,180,0.5);">DautoBlog</div>

Mẫu 10

<div style="background: #000; color: #777777; font-weight: 700; font-size: 80px ; opacity: 0.3; text-shadow: -1px -1px 1px #fff, 1px 1px 1px #000;">DautoBlog</div>

Mẫu 11

<div style="color: white; font-size: 80px; font-weight: 700; text-shadow: 1px 1px 0 #CCC, 2px 2px 0 #CCC, /* end of 2 level deep grey shadow */ 3px 3px 0 #444, 4px 4px 0 #444, 5px 5px 0 #444, 6px 6px 0 #444;">DautoBlog</div>

Code này cơ bản sẽ theo font chữ của blogspot mà bạn đã cài đặt ở phần css của blogspot,nếu muốn kiểu chữ không theo font có sẵn của blog thì ta thêm:

font-family:kiểu phông;

- Điều chỉnh cỡ chữ(font-size)
Chúc vui vẻ!

Mẫu blogger Plus UI v2.6.1 và Plus UI v2.6.2 - Không nhập key và mã hóa javascript

noreply@blogger.com (Unknown) — Sun, 10 Dec 2023 01:57:00 +0000

Bài viết này chia sẻ 2 mẫu blogger Plus UI v2.6.1 và Plus UI v2.6.2 không cần nhập key và không mã hóa javascript. Bạn có thể thoải mái tùy chỉnh một số tính năng của mẫu. Giao diện người dùng Plus là một trong những mẫu tải nhanh, thân thiện với SEO, phản hồi nhanh và tải nhanh tốt nhất.

Mẫu này có thể được sử dụng để tạo các blog như tin tức công nghệ, viết blog, Phần mềm, trò chơi, v.v. Nói chung, mẫu blogger Plus UI được thiết kế cho các blog hoặc trang web hiện đại.

Plus UI là một trong những mẫu blogger như vậy, là một mẫu tuyệt vời cho tất cả các trang web. Bạn có thể thử sử dụng mẫu này một lần. Tôi đã giải thích tất cả các tính năng của mẫu này một cách chi tiết bên dưới, vì vậy vui lòng đọc bài đăng này cho đến cuối.

Tại sao chúng ta nên dùng Plus ui v2.6.1 và Plus UI v2.6.2

Plus Ui đi kèm với nhiều tính năng tiện ích làm cho mẫu này trở nên độc đáo và bạn sẽ không tìm thấy các loại tính năng này trong bất kỳ mẫu nào ngay cả trên nền tảng giống như Envato.

Lượt xem theo thời gian thực: Bộ đếm lượt xem theo thời gian thực trên bài đăng của họ
Chế độ bảo trì: Nếu Chế độ bảo trì được bật, người xem sẽ không thể truy cập trang web của bạn cho đến thời điểm bạn đã đặt để bạn có thể thực hiện các thay đổi trên Blog của mình. Chế độ này sẽ không xuất hiện bất cứ khi nào quản trị viên của Blog của bạn truy cập.
Chỉnh sửa nhanh: Bất cứ khi nào quản trị viên truy cập Blog, nút Chỉnh sửa sẽ xuất hiện, qua đó họ có thể được chuyển hướng đến Trang Blogger / Chỉnh sửa bài viết. Họ cũng có thể sao lưu Nội dung Blog và nhiều nội dung khác. Các nút sẽ xuất hiện bên cạnh các nhận xét để quản trị viên có thể nhấp vào chúng để xóa bất kỳ nhận xét không mong muốn nào.
Đánh dấu bài viết: Add-on này sẽ cho phép khách truy cập lưu/đánh dấu bài viết để họ có thể đọc sau.
Chế độ mặc định hệ thống: Nếu người dùng chọn Chế độ mặc định hệ thống, chế độ tức là Sáng / Tối, sẽ tự động chuyển đổi theo Bảng màu của thiết bị.
Màu chủ đề: Cho phép khách truy cập của bạn chọn Màu chủ đề yêu thích cho Blog của bạn. Bạn có thể đặt bất kỳ màu nào bạn muốn.
Trình phát nhạc: Bạn đang tìm Trình phát nhạc cho blog Blogger của mình? Plus UI v2.6 đi kèm với Trình phát nhạc, với tính năng này, bạn có thể phát các tệp âm thanh của mình, chẳng hạn như MP3....
Hộp tải xuống đếm ngược: Nếu bạn đang cung cấp bất kỳ tệp nào trên Trang web của mình để tải xuống, Hộp tải xuống này sẽ hữu ích cho bạn....
Anti Ad-Blocker: để tăng tiền quảng cáo của bạn..
Sự đồng ý của cookie: Để nhận được sự đồng ý của người dùng về cookie...
Chặn quốc gia: Chặn người dùng quốc gia cụ thể truy cập trang web của bạn.
Không có kết nối Internet: Thông báo cho người dùng khi mất kết nối internet.
Force Javascript: Giúp bạn phân phát quảng cáo và nội dung một cách liền mạch.
Google Dịch: hỗ trợ đa ngôn ngữ.
Liên kết an toàn: Tăng lượt xem Bài đăng của bạn và kiếm thêm tiền.
Xếp hạng bài viết: Người dùng có thể Xếp hạng bài viết.

Một số tính năng tốt nhất trong mẫu Plus UI V2.6.1 và Plus UI v2.6.2

Đáp ứng đầy đủ
Nhiều màu sắc
Thân thiện với thiết bị di động
Thân thiện với SEO
Hỗ trợ mã ngắn
Tự động đọc thêm bằng hình thu nhỏ
Chân trang đáp ứng
Nút theo dõi xã hội
Nhiều thả xuống
Bài viết liên quan với hình thu nhỏ
Tài liệu chi tiết
Nút quay lại đầu trang
Menu và bố cục đáp ứng tốt nhất
Đánh dấu lược đồ
Điều hướng menu

Phiên bản Plus UI v2.6.1

Xem trước và tải về

Demo

file_name.zip 77.55 kb

Phiên bản Plus UI v2.6.2

Phiên bản Plus UI v2.6.2 chỉ khác phiên bản Plus UI v2.6.1 về phần thiết kế của footer.

Tải về

file_name.zip 77.55 kb

Lưu ý: Loại bỏ bộ đếm thời gian comment của mẫu đưa về thời gian mặc định của blogger

Tìm .date trong mẫu và thay

.cmHr .date{display:none}

Thành

.cmHr .date{display:inline}

Tìm: dtTm và xóa bỏ đoạn:

<b:if cond='data:blog.languageDirection != &quot;rtl&quot;'>
                                <span class='d dtTm' expr:data-datetime='data:cb.level.timestamp'/>
                              </b:if>

Xóa bỏ đoạn javascript đếm thời gian của mẫu.

<!--[ Timeago script ]-->
                                    <b:if cond='data:blog.languageDirection != &quot;rtl&quot;'>
                                      <script>/*<![CDATA[*/ (function timeAgo(selector) { var templates = {prefix: "", suffix: "", seconds: "second ago", minute: "1 min", minutes: "%d min", hour: "1 hour", hours: "%d hour", day: "1 day", days: "%d days", month: "1 month", months: "%d month", year: "1 year", years: "%d years"}; var template = function(t, n) { return templates[t] && templates[t].replace(/%d/i, Math.abs(Math.round(n))); }; var timer = function(time) { if (!time) return; time = time.replace(/\.\d+/, ""); time = time.replace(/-/, "/").replace(/-/, "/"); time = time.replace(/T/, " ").replace(/Z/, " UTC"); time = time.replace(/([\+\-]\d\d)\:?(\d\d)/, " $1$2"); time = new Date(time * 1000 || time); var now = new Date(); var seconds = ((now.getTime() - time) * .001) >> 0; var minutes = seconds / 60; var hours = minutes / 60; var days = hours / 24; var years = days / 365; return templates.prefix + ( seconds < 45 && template('seconds', seconds) || seconds < 90 && template('minute', 1) || minutes < 45 && template('minutes', minutes) || minutes < 90 && template('hour', 1) || hours < 24 && template('hours', hours) || hours < 42 && template('day', 1) || days < 30 && template('days', days) || days < 45 && template('month', 1) || days < 365 && template('months', days / 30) || years < 1.5 && template('year', 1) || template('years', years) ) + templates.suffix; }; var elements = document.getElementsByClassName('dtTm'); for (var i in elements) { var $this = elements[i]; if (typeof $this === 'object') { $this.innerHTML = timer($this.getAttribute('title') || $this.getAttribute('data-datetime')); } } setTimeout(timeAgo, 60000); })(); /*]]>*/</script>
                                    </b:if>

Bạn có nhu cầu cần mẫu blogger Plus UI Landing Page v2.6 hãy xem tại đây

Fix lỗi Google dịch:
Bản tải về cũng đã cũ nên phần Google dịch bị lỗi do lười up lại mẫu nên cần sửa lại tiện ích Google dịch theo bài hướng dẫn tại đây

Mẫu blogger Median UI v1.7 - Responsive Fix Related Posts

noreply@blogger.com (Unknown) — Fri, 08 Dec 2023 14:20:00 +0000

Bạn cần sử dụng mẫu blogger phiên bản Median UI v1.7, vậy bạn đã đến đúng địa chỉ cần download templates free. Bản này đã được chỉnh sửa related post và thêm google dịch translate.

Median UI v1.7 là một mẫu Blogger cổ điển được tạo bởi Jago deasain, mẫu này được thiết kế với khái niệm UI giao diện tối ưu rất tiện lợi cho người sử dụng vì nó rất gần gũi với các giao diện sản phẩm của google.

Thực tế đây là template sạch sẽ và có tốc độ tải nhanh khiến nó trở thành một trong những template blogger tốt nhất, một thiết kế đơn giản hơn nhưng có khả năng đọc cao là điểm cộng của template này.

Nếu bạn đang muốn tìm một template phù hợp cho một blog tin tức hay là blog cá nhân thì Median UI v1.7 là một lựa chọn đáng giá và phù hợp nhất hiện tại.

Tính năng của Median UI Template

Features	Availability
Mobile Responsive	Yes
Schema Markup	Yes
SEO Friendly	Yes
Ads Ready	Yes
Fast Loading	Yes
New Featured Post	Yes
Shortcode Support	No
Auto Read More With Thumbnail	Yes
Error 404	Yes
Responsive Footer	Yes
Social Follow Button	Yes
Multi Drop Down	Yes
Search Widget	Yes
Related Posts With Thumbnail	Yes
Social Share Button	Yes
Email News Letter Widget	Yes
Recent Post Widget	Yes
Detailed Documentation	Yes
Best Responsive Menu And Layout	Yes

Change log Median UI 1.7

Cho phép: Xác định thiết kế của riêng bạn, có thể thay đổi nhiều màu sắc và hình nền hơn thông qua Tùy chỉnh Chủ đề Blogger.
Cho phép: Thay đổi kích thước logo tiêu đề thông qua Tùy chỉnh Chủ đề Blogger.
Thêm: Đánh dấu bài đăng này | igniel.com
Thêm: Nút Sao chép vào khay nhớ tạm trên Công cụ đánh dấu cú pháp.
Thêm: Chuẩn hóa.css v8.0.1 | github.com/necolas/normalize.css
Thêm: Thành phần bài viết mới: Guide list , Pros/conslist list , Manual lightbox image .
Thêm: Nhiều tùy chọn phong cách hơn trên bàn.
Thêm: Danh sách nhãn ở cuối bài.
Tối ưu: DarkMode v2.0, thêm tùy chọn chế độ tối dựa trên hệ thống mặc định.
Tối ưu: TimeAgo v2.0, Dễ dàng chọn định dạng dấu thời gian hơn.
Tối ưu: Bài đăng sản phẩm v2.0, Đã thêm tùy chọn giảm giá từ 10% đến 90%.
Tối ưu: Thanh trượt tiện ích v2.0.
Tối ưu: Dễ dàng hơn để tìm hiểu tài liệu.
Tối ưu: Viết cấu trúc mã đơn giản.
Cải thiện: Thay đổi vị trí của các tiện ích Hồ sơ.
Cải thiện: Dễ dàng thay đổi một số văn bản mặc định hơn, giờ đây bạn có thể thay đổi một số văn bản thông qua Bố cục Blogger.
Cải thiện: Ẩn một phần hồ sơ mô tả quá dài.
Cải thiện: Đã chuyển cột nhận xét Blogger sang phần đầu tiên.
Cải thiện: Hoàn toàn sử dụng Iconsax | vuesax.com .
Loại bỏ: Tính năng hình ảnh hộp đèn tự động, hiện tính năng này phải được thêm thủ công.
Loại bỏ: Sơ đồ trang web trên staticPage.
Loại bỏ: Tính năng chia bài.
Loại bỏ: Tiện ích Biểu mẫu Liên hệ trên một trang tĩnh .
Sửa lỗi: Một số bố cục tiện ích không vừa khi được thêm lại.
Sửa lỗi: Không thể thêm liên kết đến hình ảnh trong bài đăng.
Sửa lỗi: Các cải tiến đối với lược đồ JSON, đã thêm các url ảnh và hồ sơ thay thế để tránh lỗi.
Sửa lỗi: Lỗi đã biết/báo cáo.

Demo và Download

Demo thôi khỏi xem vì chỉ fix Related post:

Median UI v1.7.zip 67.2 KB

Mẫu blogger Median UI AMP v1.5 và UI AMP v1.6 Premium Blogger Template

noreply@blogger.com (Unknown) — Fri, 08 Dec 2023 10:49:00 +0000

Bạn có muốn phiên bản Median ui AMP v1.5 và Median ui AMP v1.6 không? Nếu có, thì bài viết này sẽ giúp bạn tải xuống phiên bản mới nhất của Median AMP v1.5 và Median AMP v1.6 Blogger Template và nó hoàn toàn miễn phí.

Nếu nói về những mẫu blogger này thì đây là những mẫu được đánh giá cao trong thời gian vừa qua và nó cũng đang là xu hướng trên google. Nhưng nếu bạn truy cập trang web chính thức để tải xuống các mẫu này thì nó có thể tốn kém một chút kinh phí của bạn.

Trước khi bạn tải xuống mẫu này, bạn nên xem một số tính năng và lợi ích SEO của mẫu này để bạn biết tất cả các chức năng mà mẫu blog này hiện có.

Median UI AMP v1.5 Premium Blogger Template

Median AMP về cơ bản là một phiên bản Amp của giao diện người dùng trung bình. Nó có điểm SEO rất cao và do đó nó làm giảm tỷ lệ thoát. Nó có tiện ích câu chuyện hàng đầu xuất hiện trên google và do đó Phiên bản AMP tốt hơn nhiều so với Giao diện người dùng trung bình, Nhưng do một số hạn chế, nó không có Tiện ích bảng nội dung tự động.

Các tính năng chi tiết của Median AMP v1.5:

Trang AMP hợp lệ.
Điểm SEO cao
Thông tin chi tiết về tốc độ trang cao
Đoạn mã kết quả nhiều định dạng hợp lệ
Theo dõi - Hộp tác giả
Bình luận trên Blogger, Disqus & Facebook
Bài nổi bật
Menu thanh bên di động
Biểu tượng SVG mới
Khả năng đọc cao
Hỗ trợ thẻ được tài trợ
Đáp ứng đầy đủ
Thân thiện với SEO
2 cột có sẵn
Breadcrumbs có cấu trúc hợp lệ
Mã ngắn
Tiện ích bản tin
Các nút chia sẻ trên mạng xã hội
& Nhiều hơn nữa ...

Cách đăng ảnh trong mẫu AMP:

Khi post ảnh đầu tiên trong bài viết cần theo html bên dưới:

<table class='tr-caption-container'>
<tbody>
    <tr>
      <td>
        <amp-img alt="/" width="/" height="/"  src="Link ảnh đầu tiên" title="/" layout='intrinsic' ></amp-img>
        <noscript><img alt="/" width="/" height="/" src="Link ảnh đầu tiên" title="/" /></noscript>
      </td>
    </tr>
  </tbody>
</table>

Các ảnh từ ảnh thứ 2 theo html:

<amp-img alt="/" width="/" height="/"  src="Link ảnh tiếp theo" title="/" layout='intrinsic' ></amp-img>

Lưu ý:
Trong bài viết chỉ nên dùng thẻ div với class không được dùng style='.... vì sẽ bị lỗi AMP.

Bạn có thể tham khảo thêm các bài viết Tại đây để hoàn thiện thêm mẫu AMP của mình.

Kiểm tra blog đã đạt chuẩn AMP chưa tại đây

Demo

Median UI AMP v1.5.zip 45.43 KB

Median UI AMP v1.6 [Final] Premium Blogger Template

Có lẽ đây có thể là phiên bản cuối cùng về Median AMP. So với bản v1.5 nó cơ bản cũng giống với bản NOAMP về một số thay đổi ví dụ như:

Menu trên Desktop mặc định chỉ hiển thị icon muốn xem phải click để mở rộng.
Menu chân trang trên mobile thêm chú thích cùng icon để người dùng dễ phân biệt chức năng.
Phần bình luận vẫn ở dạng popup nhưng được điều chỉnh ra giữa, trông đẹp và tiện hơn so với lề phải như bản cũ.
Tự động hiển thị Description xuống dưới tiêu đề, như 1 đoạn tóm tắt bài viết.
Phần bài viết liên quan thêm đánh số thứ tự.
Sửa lỗi ảnh bị mờ do link ảnh kiểu mới của blogger.
Sửa lỗi dữ liệu có cấu trúc author bị thiếu trường url.
Giao diện trang chủ không còn dạng bài mới ở dạng list.
Và một vài thay đổi về code button.....

Tải về dùng thử

Demo

Median UI AMP v1.6 [Final].zip 53.7 KB

Bạn có nhu cầu sử dụng Median UI v1.5 và UI v1.6 không phải AMP có thể tải về Tại đây

Tạo Safelink tự động get link với bài viết ngẫu nhiên cho mẫu Plus UI v2.6

noreply@blogger.com (Unknown) — Thu, 07 Dec 2023 04:59:00 +0000

Safelink trên blog chính như đã chia sẻ tại đây nó cũng hoàn toàn tự động get link nhưng là tại 1 hay 2 bài đăng trong phần trang riêng trên blog, còn bài viết này hướng dẫn tạo Safelink nó tự hiện thị trên một bài viết ngẫu nhiên nào đó của blog mà trên đó đã có sẵn các mã quảng cáo.

Lợi ích liên kết an toàn Safelink

Không cần tạo blog mới và mua tên miền mới
Phương tiện đặt adsense để tăng thu nhập cho blog.
Dễ dàng tùy chỉnh hơn
Giảm tỷ lệ thoát của blog chính
Tăng xếp hạng trang blog vì khách truy cập tăng
An toàn 100% vì nó vẫn ở cùng tên miền với blog chính
Ở lại trên blog chính, nghĩa là nó sẽ tự động tăng lượng người truy cập vào blog chính.

Hướng dẫn tạo Safelink tự động ngẫu nhiên trên mẫu giao diện Plus UI v2.6

Trước khi bắt đầu, chúng ta hãy xem Demo của nó bằng cách click vào nút Download ở cuối bài viết của trang giới thiệu về demo.

Demo

Thêm mã CSS, Javascript và HTML

Bước 1: Thêm mã CSS này vào CSS select

/* Human Verification */ .hmv{position:relative;font-family:var(--fontBa);border-radius:10px;padding:30px 20px;margin-bottom:40px;text-align:center;overflow:hidden} .hmv::before{content:'';position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;background:var(--linkB);opacity:.06} .hmv::after{content:'';width:60px;height:60px;background:rgba(0,0,0,.15);display:block;border-radius:50%;position:absolute;top:-12px;left:-12px;opacity:.1} .hmv >*{position:relative;z-index:1} .hmv .hmvH{font-size:1.2rem;font-weight:700;margin-bottom:15px} .hmv .hmvD{font-family:var(--fontB);font-size:13px;opacity:.8;display:inline-flex;align-items:center} .hmv .hmvD svg{width:13px;height:13px;margin-right:5px} .hmv:not(.alt) .button, .hmv.alt .hmvH.bef, .hmv:not(.alt) .hmvH.aft, .hmv.alt .hmvD{display:none} .drK .hmv::before{background:var(--darkBs);opacity:1}

Bước 2: Thêm css sau vào trước thẻ </head>

<b:if cond='data:view.isSingleItem'> 
<style>/*<![CDATA[*/
/* Scroll to Continue */ .aSlT, .aSlB{display:none;align-items:center;justify-content:center;text-align:center;padding:30px 0} .aSlP{display:block;position:relative;height:40px;width:100%;display:none;align-items:center;justify-content:center;z-index:0;border-radius:var(--buttonR);overflow:hidden} .aSlP::before{content:''; position: absolute;top:0;right:0;bottom:0;left:0; background:var(--linkC);opacity:.5} .aSlW{position: absolute;top:0;bottom:0;left:0;width:0;background:var(--linkC);opacity:.6;transition:width 1s ease} .aSlP > span{position:absolute;color:#fffdfc;font-size:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis} .aScr{display:none;position:relative;width:100%;font-family:var(--fontBa);border-radius:10px;padding:30px 20px;text-align:center;overflow:hidden} .aScr::after{content:'';width:60px;height:60px;background:rgba(0,0,0,.15);display:block;border-radius:50%;position:absolute;top:-12px;left:-12px;opacity:.1} .aScr::before{content:'';position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;background:var(--linkB);opacity:.06} .aScr .hglt{color:var(--linkC)} .aScr .aScrH{position:relative;z-index:1;font-size:1.2rem;font-weight:700;margin-bottom:15px} .aScr .aScrD{position:relative;z-index:1;font-family:var(--fontB);font-size:13px;opacity:.8;display:inline-flex;align-items:center} .aScr .aScrD svg{width:13px;height:13px;margin-right:5px;stroke-width:1.5} .aSlT.vsbl, .aSlB.vsbl, .aSlT:not(.alt) .aSlP{display:flex} .aSlT.alt .aScr{display:block} .aSlT.nInt .aSlP > span{font-size:13px} .Rtl .aSlW{left:unset;right:0} .Rtl .aScr .aScrD svg{margin-right:0;margin-left:5px} .drK .aSlP::before{background:var(--darkBs);opacity:1} .drK .aSlW{background:var(--darkBa);opacity:1} .drK .aScr{background:var(--darkBs)} .drK .aScr::before{background:var(--darkBa);opacity:1} .drK .aScr .hglt{color:var(--darkU)}
/*]]>*/</style>
</b:if>

Bước 3: Thêm mã javascript sau vào trước thẻ </head>

<script>/*<![CDATA[*//* Safelink */ function _0x4001(){var r=["indexOf","fromCharCode","248082FnFLPu","2dyVCwX","851934NCaRZc","1464344UJimDR","255DsMQPg","13242QFkwLe","472829bEwnSk","24WKgyRt","3319965YzkqUw","10ZsypoO","875633sYiivu","MNBVCXZLKJHGFDSAPOIUYTREWQmnbvcxzlkjhgfdsapoiuytrewq0987654321+/=","_utf8_enc","charCodeAt","_keyStr","charAt","replace","length"];return(_0x4001=function(){return r})()}function _0x2f39a2(r,n){return _0x3fd0(r-544,n)}function _0x3fd0(r,n){var t=_0x4001();return(_0x3fd0=function(r,n){return t[r=+r]})(r,n)}!function(){function r(r,n){return _0x3fd0(n-107,r)}var n=_0x4001();function t(r,n){return _0x3fd0(n-241,r)}for(;;)try{if(213392==+parseInt(r(105,107))*(-parseInt(r(107,108))/2)+-parseInt(r(99,109))/3+parseInt(r(116,110))/4+parseInt(r(116,111))/5*(-parseInt(t(255,246))/6)+parseInt(t(249,247))/7*(parseInt(r(109,114))/8)+parseInt(t(258,249))/9+parseInt(t(245,250))/10*(-parseInt(r(113,117))/11))break;n.push(n.shift())}catch(r){n.push(n.shift())}}();var b64={_keyStr:_0x2f39a2(555,551),enc:function(r){function n(r,n){return _0x3fd0(r- -600,n)}var t,e,f,i,u,c,a="",o=0;function d(r,n){return _0x3fd0(r- -100,n)}for(r=b64[n(-588,-592)](r);o<r.length;)f=(c=r.charCodeAt(o++))>>2,i=(3&c)<<4|(t=r[d(-87,-84)](o++))>>4,u=(15&t)<<2|(e=r[d(-87,-97)](o++))>>6,c=63&e,isNaN(t)?u=c=64:isNaN(e)&&(c=64),a=a+this[d(-86,-93)][d(-85,-83)](f)+this[n(-586,-579)].charAt(i)+this[d(-86,-88)][n(-585,-583)](u)+this._keyStr[n(-585,-579)](c);return a},dec:function(r){function n(r,n){return _0x3fd0(r-70,n)}function t(r,n){return _0x3fd0(r-457,n)}var e,f,i,u,c,a="",o=0;for(r=r[t(473,474)](/[^A-Za-z0-9\+\/\=]/g,"");o<r[t(474,475)];)e=this._keyStr[n(88,89)](r[t(472,474)](o++))<<2|(i=this[n(84,91)].indexOf(r.charAt(o++)))>>4,f=(15&i)<<4|(u=this[n(84,91)].indexOf(r[n(85,83)](o++)))>>2,i=(3&u)<<6|(c=this[t(471,471)].indexOf(r[n(85,93)](o++))),a+=String[n(89,97)](e),64!=u&&(a+=String.fromCharCode(f)),64!=c&&(a+=String[n(89,95)](i));return b64._utf8_dec(a)},_utf8_enc:function(r){function n(r,n){return _0x3fd0(r-954,n)}r=r[n(970,962)](/\r\n/g,"\n");for(var t="",e=0;e<r[n(971,973)];e++){var f=r[n(967,972)](e);f<128?t+=String[n(973,983)](f):(127<f&&f<2048?t+=String[i(659,662)](f>>6|192):(t+=String.fromCharCode(f>>12|224),t+=String.fromCharCode(f>>6&63|128)),t+=String[i(671,662)](63&f|128))}function i(r,n){return _0x3fd0(n-643,r)}return t},_utf8_dec:function(r){function n(r,n){return _0x3fd0(r-515,n)}for(var t="",e=0,f=c1=c2=0;e<r[n(532,525)];)(f=r[i(391,387)](e))<128?(t+=String[n(534,526)](f),e++):191<f&&f<224?(c2=r.charCodeAt(e+1),t+=String[n(534,543)]((31&f)<<6|63&c2),e+=2):(c2=r.charCodeAt(e+1),c3=r[i(391,388)](e+2),t+=String.fromCharCode((15&f)<<12|(63&c2)<<6|63&c3),e+=3);function i(r,n){return _0x3fd0(r-378,n)}return t}}; /*]]>*/</script>

Bước 4: Thêm javascript sau vào trước thẻ </body> hoặc </body>

<script>/*<![CDATA[*/
/* Safelink Settings */ var aSl={par:"url",hcd:5000,gcd:15000,nwt:false,sby:"published",mxr:20,pwt:"Getting your link..."};
/* Safelink */ function _0x1541(t,n){var e=_0x4a4c();return(_0x1541=function(t,n){return e[t=+t]})(t,n)}function _0x4a4c(){var t=[".safeL","location","hash","includes","split","get","length","click","preventDefault","target","getAttribute","href","par","nwt","open","_blank","dec","replace","feeds/posts/summary?alt=json&orderby=","&max-results=","sSS","toString","indexOf","history","replaceState","title","feed","entry","floor","random","alternate","link","hmVrfy","hidden","#hmVrfy .pstL","alt","No post was found","SAFE_L","true","gSS","gcd",".safeGoL","setAttribute","vsbl","innerHTML","pwt","rSS"];return(_0x4a4c=function(){return t})()}!function(){var t=224,n=230,e=255,r=236,a=229,l=240,i=246,u=257,o=249,s=236,c=94,S=263,d=242,f=243,x=225,_=244,h=245,v=103,g=89,w=239,p=246,b=81,m=88,L=248,q=96,y=86,C=275,P=261,A=73,E=72,M=264,k=261,T=252,G=71,N=70,U=233,j=235,F=237,I=81,O=69,V=108,B=102,D=68,H=218,J=231,R=329,W=66,z=278,K=52,Q=440,X=462,Y=223,Z=439,$=462,tt=926,nt=916,et=416,rt=249,at=238,lt=418,it=724,ut=737,ot=35,st=53,ct=736,St=755,dt=735,ft=777,xt=757,_t=741,ht=757,vt=38,gt=45,wt=751,pt=732,bt=752,mt=731,Lt=739,qt=730,yt=729,Ct=22,Pt=8,At=763,Et=770,Mt=754,kt=747,Tt=112,Gt=116,Nt=758,Ut=753,jt=499,Ft=477,It=504,Ot=514,Vt=224,Bt=111;function Dt(t,n){return _0x1541(n- -Bt,t)}function Ht(t,n){return _0x1541(n-Vt,t)}var Jt,Rt,Wt,zt,Kt=qSell(Ht(208,t));function Qt(t){var e=498;const n=window[r(jt,Ft)][r(500,483)];function r(t,n){return _0x1541(t-e,n)}if(n&&n[r(501,It)]("=")&&n[r(502,518)](/=(.*)/s)[0]=="#?"+t&&""!=n.split(/=(.*)/s)[1])return window[r(499,Ot)].hash.split(/=(.*)/s)[1]}function Xt(t){var n=window[_0x1541(Gt-115,Tt)].search;const e=new URLSearchParams(n);return e.has(t)?e[_0x1541(Nt-753,Ut)](t):void 0}0<Kt[Ht(245,n)]&&Kt.forEach(t=>{var a=448,l=449,i=447,u=427,o=160,s=144,c=138,S=422,d=147,f=134,x=454,_=441,h=465,v=455,g=456;t.addEventListener(_0x1541(Mt-kt,Et),function(t){function n(t,n){return _0x1541(n- -147,t)}function e(t,n){return _0x1541(t- -g,n)}t[e(-a,-l)]();var r=t[e(-i,-u)][n(-158,-137)](n(-o,-136)),t=t[n(-s,-c)].getAttribute("data-href");null!=(t=null!=r&&"/"!=r&&"#"!=r&&""!=r?r:null!=t&&"#"!=t&&""!=t?t:void 0)&&(t=b64.enc(t),t=blogUrl+"#?"+aSl[e(-444,-S)]+"="+t,1==aSl[n(-d,-f)]?window[e(-442,-x)](t,e(-_,-h)):window.location[e(-445,-v)]=t)})}),null==Qt(aSl[Ht(e,r)])&&null==Xt(aSl.par)||(Kt=null!=Qt(aSl[Dt(-98,-99)])?b64[Ht(a,l)](Qt(aSl[Ht(i,r)])):b64[Ht(u,l)](Xt(aSl[Ht(o,s)])),Jt=blogUrl[Dt(-92,-c)](/.*?:\/\//g,"//")+Ht(S,d)+aSl.sby+Ht(S,f)+aSl.mxr,Pu[Ht(x,_)]("SAFE_L",Kt),0<(Kt=window[Dt(-129,-110)][Ht(t,h)]())[Dt(-v,-g)]("#")&&(Kt=Kt.substring(0,Kt[Ht(w,p)]("#")),window[Dt(-b,-m)][Ht(242,L)]({},document[Dt(-q,-y)],Kt)),Pu.gAj({url:Jt,async:!0,success:function(t){var n=956,e=713;function r(t,n){return _0x1541(n- -At,t)}function a(t,n){return _0x1541(t-Pt,n)}if((t=JSON.parse(t)[r(-it,-ut)]).entry&&0!==t[a(ot,st)].length){for(var l,i,u=(t=t[r(-725,-ct)])[Math[r(-St,-dt)](Math[a(37,49)]()*t[r(-ft,-xt)])],o=0,s=u.link[r(-_t,-ht)];o<s;o++)a(vt,gt)==(i=u[r(-wt,-pt)][o]).rel&&(l=i.href);remCt(getid(r(-bt,-mt)),r(-Lt,-qt)),qSel(r(-749,-yt)).href=l,setTimeout(function(){addCt(getid(_0x1541(-961- -993,-n)),_0x1541(-678- -e,-657))},aSl.hcd)}else toastNotif(a(44,Ct))}})),null!=Pu.gSS(Ht(C,P))&&Dt(-69,-A)==isPost&&(Jt=Pu[Dt(-60,-E)](Ht(M,k)),Rt=Math[Ht(239,T)](aSl[Dt(-E,-G)]/1e3),Wt=Rt,qSel(Dt(-74,-N))[Ht(U,j)]=Jt,1==aSl[Ht(243,F)]&&qSel(".safeGoL")[Dt(-I,-O)](Dt(-V,-B),Ht(t,239)),addCt(getid("aSlCnt"),Dt(-49,-D)),zt=setInterval(function(){var t=193,n=246,e=--Wt/Rt*100;function r(t,n){return _0x1541(n-lt,t)}qSel(".aSlW").style.width=100-e+"%",qSel(".aSlCd")[r(Q,X)]=Math[_0x1541(-218- -n,-Y)](Wt),Wt<=0&&(clearInterval(zt),qSel(".aSlCd")[r(Z,$)]="0",setTimeout(()=>{qSel(".aSlC")[_0x1541(et-372,396)]=aSl[_0x1541(at-t,rt)]},1e3),setTimeout(()=>{var t=959;addCt(qSel(".aSlB"),_0x1541(-nt- -t,-tt)),addCt(getid("aSlCnt"),"alt")},4e3))},1e3),qSel(".safeGoL").addEventListener(Ht(H,J),function(){Pu[_0x1541(324-z,R)](_0x1541(89-K,W))}))}(); if(qSel('.aScr')!==null){qSel('.aScr').addEventListener('click', () =>{setTimeout(() =>{qSel('.safeGoL').scrollIntoView({behaviour:'smooth', block:'center', inline:'center'})},200)})}
 /*]]>*/</script>

Bước 5: Thêm mã HTML sau vào ngay sau thẻ <main class='blogItm mainbar'>

<!--[ Safelink Random ]-->
                      <b:if cond='data:view.isHomepage'>
                        <!--[ Human verification ]-->
                        <div class='hmv hidden' id='hmVrfy'>
                          <div class='hmvH bef'>Xác minh bạn không phải là Robot</div>
                          <div class='hmvH aft'>Bạn có phải là robot không?</div>
                          <div class='hmvD'><svg viewBox='0 0 50 50' x='0px' y='0px'><path d='M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z'><animateTransform attributeName='transform' attributeType='xml' dur='0.6s' from='0 25 25' repeatCount='indefinite' to='360 25 25' type='rotate'/></path></svg>Đang tạo liên kết... Vui lòng đợi</div>
                          <a class='button pstL' href='/'>Tôi không phải là robot</a>
                        </div>
                      </b:if>
                   <!--[ Safelink Random ]-->

Bước 6: Thêm mã HTML sau vào ngay sau thẻ <b:tag class='pInr' cond='data:view.isSingleItem' name='div'>

<!--[ Safelink Random ]-->
                                 <b:if cond='data:view.isPost'>
                                   <!--[ Safelink Countdown Timer ]-->
                                   <div class='aSlT' id='aSlCnt'>
                                     <div class='aSlP'>
                                       <div class='aSlW'/>
                                       <span class='aSlC'>Vui lòng chờ <span class='aSlCd'>0</span> giây...</span>
                                     </div>
                                     <div class='aScr'>
                                       <div class='aScrH'>Cuộn xuống và nhấp vào <span class='hglt'>Chuyển đến liên kết</span> cho điểm đến</div>
                                       <div class='aScrD'><svg class='line' viewbox='0 0 24 24'><path d='M22 11.07V12a10 10 0 1 1-5.93-9.14'/><polyline points='23 3 12 14 9 11'/></svg>Chúc mừng! Liên kết được tạo</div>
                                     </div>
                                   </div>
                                 </b:if>
                              <!--[ Safelink Random ]-->

Bước 7: Thêm mã HTML sau vào ngay sau thẻ <data:post.body/>

<!--[ Safelink Random ]-->
                                      <b:if cond='data:view.isPost'>
                                      <!--[ Safelink Destination Button ]-->
                                        <div class='aSlB'>
                                          <a class='button safeGoL' href='/' title='Chuyển đến liên kết'><i class='icon demo'/>Chuyển đến liên kết</a>
                                        </div>
                                      </b:if>
                                    <!--[ Safelink Random ]-->

Cách tạo bài đăng có dùng Safelink tự động ngẫu nhiên

Tại phần nút tải về bạn sử dụng code sau

<a class='button safeL' aria-label='Download' href='Link cần đến' ><i class='icon dl'></i></a>

Xem thêm:
- Tạo safelink random cho bolog không phải Plus ui v2.6 tại đây
- Nút tải xuống dạng popup với đồng hồ đếm ngược và gắn quảng cáo tại đây

Mẫu blogger Pixy Newspaper 11 bản thiếu không bản quyền chân trang

noreply@blogger.com (Unknown) — Wed, 06 Dec 2023 15:40:00 +0000

Mẫu blogger phản hồi cao cấp có tên Pixy Newspaper 11. Pixy Newspaper 11 là một trong những mẫu thiết kế giao diện người dùng tốt nhất, thân thiện với SEO, phản hồi nhanh và tải nhanh. Mẫu này có thể được sử dụng để tạo các blog như tin tức công nghệ, viết blog, chơi game, v.v. Nói chung, mẫu blogger Pixy Newspaper 11 được thiết kế cho các blog hoặc trang web hiện đại.

Nhưng tại bài viết này rất tiếc là chỉ chia sẻ được mẫu Pixy Newspaper 11 bản thiếu dành cho những người yêu thích Pixy Newspaper 11 nhưng không có điều kiện sở hữu bản đầy đủ các chuyên mục như bản đủ. Nhưng bù lại bạn sẽ được sở hữu một bản thiếu đã được thêm chế độ darkmore và loại bỏ hoàn toàn bản quyền chân trang, ở đây là loại bỏ chứ không phải chỉ là ẩn.

Pixy Newspaper 11 là một trong những mẫu blogger tuyệt vời cho tất cả các trang web. Mẫu blogger này được tạo bởi một trang web có tên là Mẫu Piki.

Mẫu Blogger Pixy Newspaper 11 là một trong những mẫu có tốc độ tải nhanh. Mẫu này hoàn toàn đáp ứng và thân thiện với thiết bị di động. Mẫu blogger Pixy Newspaper 11 hoạt động tốt trên tất cả các thiết bị vì các công cụ tìm kiếm như Google ưu tiên lập chỉ mục di động.

Mẫu blogger Pixy Newspaper 11 được tối ưu hóa hoàn toàn cho công cụ tìm kiếm. Tất cả các thẻ meta và các bài tập SEO khác cũng có trong mẫu blogger Pixy Newspaper 11 này. Mẫu này đã được thiết kế để lưu ý đến SEO. Bởi vì, SEO là khía cạnh quan trọng nhất của bất kỳ trang web nào giúp người dùng internet có thể nhìn thấy nó.

Mẫu blogger Pixy Newspaper 11 có thể được chỉnh sửa thông qua phần bố cục của blogger. Màu sắc trong mẫu Pixy Newspaper 11 này cũng có thể dễ dàng thay đổi thông qua tùy chỉnh chủ đề blogger.

Một số tính năng của Mẫu Blogger Pixy Newspaper

Thiết kế đáp ứng 100%
Tải nhanh
Thân thiện với SEO
Tự động dịch
Tùy chọn thanh bên trái / phải
Video YouTube đáp ứng
Thực đơn lớn của Ajax
Nút theo dõi trên mạng xã hội
Phần quảng cáo khác nhau
Mục lục
Đăng mã ngắn
bài viết liên quan
Bình luận trên Blogger, Disqus và Facebook
Phần giới thiệu tuyệt vời
Đồng ý sử dụng cookie
Và nhiều hơn nữa….

Demo ở đây là bản đủ gọi là xem cho biết còn bản miễn phí không có các chuyên mục.
Demo

Pixy Newspaper 11.zip 71.6 KB

Báo cáo vi phạm bản quyền nội dung với Google cho web/blog

noreply@blogger.com (Unknown) — Tue, 05 Dec 2023 17:30:00 +0000

DMCA là viết tắt của cụm từ Digital Millennium Copyright Ac, cụm từ này dịch sang tiếng Việt có nghĩa là đạo luật bản quyền kỹ thuật số thiên niên kỷ của Google.

Đạo luật này được tạo ra để giúp bảo vệ bản quyền tác giả của các tác phẩm kỹ thuật số trên mạng internet.

Web/blog sau khi đăng ký DMCA và được công cụ này bảo vệ thì bạn có thể báo cáo vi phạm bản quyền nội dung theo 2 hình thức:

- Trực tiếp trên web của DMCA nhưng dịch vụ này phải trả phí.
- Báo cáo vi phạm bản quyền nội dung miễn phí trên Google và kết quả là Google sẽ xóa trang vi phạm trong kết quả tìm kiếm.

Ở bài viết này chỉ đề cập tới hình thức báo cáo vi phạm bản quyền nội dung với google theo hình thức miễn phí.

Báo cáo vi phạm bản quyền nội dung với Google cho web/blog

Bước 1: Truy cập vào trang yêu cầu xóa nội dung khỏi Google: Tại đây
Bước 2: Chọn một loại sản phẩm của Google bạn muốn xóa. Trong trường hợp này chọn mục "Google tìm kiếm".

Bước 3: Chọn mục "Tôi có vấn đề pháp lý chưa được đề cập ở trên" để báo cáo vi phạm bản quyền.

Bước 4: Chọn "Tôi đã tìm thấy nội dung có thể vi phạm bản quyền của mình".

Bước 5: Chọn "Có, tôi là chủ bản quyền hoặc được ủy quyền hành động thay mặt cho chủ sở hữu của quyền duy nhất được cho là bị vi phạm" để xác nhận.

Bước 6: Tùy vào loại nội dung vi phạm mà bạn đưa ra lựa chọn phù hợp.

Bước 7: Chọn "Biểu mẫu này" để điền thông tin về tác phẩm bị vi phạm.

Bước 8: Điền đầy đủ các thông tin trong biểu mẫu "Thông tin liên hệ của chủ sở hữu tác phẩm."

Bước 9: Thông tin về nội dung vi phạm bản quyền. Nếu có quá nhiều website sao chép nội dung, bạn chọn "Thêm nhóm mới" để thêm những trang web đó vào.

Tại bước này trong khung "Nội dung vi phạm" bạn có thể điền theo nhiều cách như hướng dẫn ví dụ bị sao chép nội dung thì ghi là bị sao chép nội dung khi chưa có sự đồng ý của bạn hoặc là bị chia sẻ trái phép phần mềm hoặc mẫu blogger, hình ảnh...thuộc bản quyền của bạn....và nhớ ghi bằng tiếng Anh thì tốt hơn.
Còn các ô sau thì quá dễ rồi.
Bước 10: Chọn lời tuyên thệ và điền chữ ký. Sau đó nhấp "Gửi" để yêu cầu Google xóa bài viết vi phạm trên kết quả tìm kiếm.

Nên dùng Gmail tạo Blog đang có bài bị vi phạm để báo cáo lên Google và sau khi báo cáo vi phạm nếu báo cáo của bạn là đúng thì chỉ sau 2 ngày là có kết quả.

Cài đặt code chặn người dùng sử dụng Adblock chặn quảng cáo

noreply@blogger.com (Unknown) — Tue, 05 Dec 2023 04:48:00 +0000

Bạn có một trang blog chia sẻ thủ thuật, chia sẻ game hay, chia sẻ phần mềm hữu ích miễn phí và có chạy quảng cáo của Adsense để kiếm thêm thu nhập.

Tất cả những gì bạn chia sẻ đều là miễn phí, tuy rằng bạn cũng cần traffic tức lưu lượng truy cập nhưng bạn cũng cần có thu nhập từ quảng cáo nhưng khách truy cập sử dụng trình duyệt có cài tiện ích mở rộng Adblock để chặn quảng cáo và dùng chùa blog của bạn thì quả là không mấy công bằng.

Nếu thực sự không cần khách truy cập dạng này thì bạn có thể cài code chặn người dùng sử dụng Adblock chặn quảng cáo. Tuy nhiên việc gì đều có mặt lợi và hại nên cần suy nghĩ kỹ trước khi sử dụng.

Để cài đặt code chặn người dùng sử dụng trình duyệt cài Adblock chặn quảng cáo cho blogspot/blogger bạn cần vào chỉnh sửa mẫu thêm CSS và Javascript. Bài viết này chia sẻ 3 kiểu xuất hiện thông báo với 3 code css tương ứng còn javascript là dùng chung cho cả 3 mẫu css.

3 mẫu CSS có thể sử dụng.

Mẫu 1

/* Animation Adblock */
@keyframes fadeInDown{from{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}
/* Adblock */
#arlinablock{background:rgba(20,20,20,0.50);position:fixed;margin:auto;left:0;right:0;top:0;bottom:0;overflow:auto;z-index:999999;animation:fadeInDown 1s}
#arlinablock .header{margin:0 0 15px 0}
#arlinablock .inner{background:#fff;color:#222;box-shadow:0 0 2rem -1rem rgba(0,0,0,0.5);text-align:center;width:100%;max-width:640px;padding:30px;margin:7% auto 2% auto;animation:fadeInDown 1s}
#arlinablock button{padding:10px 20px;border:0;background:#fff;color:#e74c3c;margin:20px 5px;cursor:pointer;border-radius:3px;font-size:13px;font-weight:600;border:2px solid #e74c3c;transition:initial}
#arlinablock button:hover{background:#2c3e50;color:#fff;outline:none;border-color:#2c3e50}
#arlinablock button.active,#arlinablock button:hover.active{background:#e74c3c;color:#fff;border-color:#e74c3c;outline:none}
#arlinablock .fixblock{background:#fff;text-align:left;color:#000;padding:20px;height:250px;overflow:auto;line-height:30px}
#arlinablock .fixblock div{display:none}
#arlinablock .fixblock div.active{display:block}
#arlinablock ol{margin-left:20px}
@media(max-width:768px){#arlinablock .inner{width:calc(100% - 20px);margin:10px auto;padding:15px}}

Mẫu 2

/* Animation Adblock */
@keyframes fadeInDown{from{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}
/* Adblock */
#arlinablock{background:rgba(20,20,20,0.70);position:fixed;margin:auto;left:0;right:0;top:0;bottom:0;overflow:auto;z-index:999999;animation:fadeInDown 1s}
#arlinablock .header{margin:0 0 15px 0}
#arlinablock .inner{background:#e3482d;color:#fff;box-shadow:0 5px 20px rgba(0,0,0,0.1);text-align:center;width:100%;max-width:640px;padding:30px;margin:7% auto 2% auto;animation:fadeInDown 1s}
#arlinablock button{padding:10px 20px;border:0;background:rgba(0,0,0,0.15);color:#fff;margin:20px 5px;cursor:pointer;transition:all .3s}
#arlinablock button:hover{background:rgba(0,0,0,0.35);color:#fff;outline:none}
#arlinablock button.active,#arlinablock button:hover.active{background:#fff;color:#222;outline:none}
#arlinablock .fixblock{background:#fff;text-align:left;color:#000;padding:20px;height:250px;overflow:auto;line-height:30px}
#arlinablock .fixblock div{display:none}
#arlinablock .fixblock div.active{display:block}
#arlinablock ol{margin-left:20px}
@media(max-width:768px){#arlinablock .inner{width:calc(100% - 20px);margin:10px auto;padding:15px}}

Mẫu 3

/* Animation Adblock */
@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}100%{opacity:1;transform:translateY(0)}}
@keyframes rubberBand{from{transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,0.75,1)}40%{transform:scale3d(0.75,1.25,1)}50%{transform:scale3d(1.15,0.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}to{transform:scale3d(1,1,1)}}
/* Adblock */
#arlinablock{background:rgba(0,0,0,0.65);position:fixed;margin:auto;left:0;right:0;top:0;bottom:0;overflow:auto;z-index:999999;animation:fadeInDown 1s}
#arlinablock .header{margin:0 0 15px 0}
#arlinablock .inner{background:#e3482d;color:#fff;box-shadow:0 5px 20px rgba(0,0,0,0.1);text-align:center;width:600px;padding:40px;border-radius:5px;margin:7% auto 2% auto;animation:rubberBand 1s}
#arlinablock button{padding:10px 20px;border:0;background:rgba(0,0,0,0.15);color:#fff;margin:20px 5px;cursor:pointer;transition:all .3s}
#arlinablock button:hover{background:rgba(0,0,0,0.35);color:#fff;outline:none}
#arlinablock button.active,#arlinablock button:hover.active{background:#fff;color:#222;outline:none}
#arlinablock .fixblock{background:#fff;text-align:left;color:#000;padding:20px;height:250px;overflow:auto;line-height:30px}
#arlinablock .fixblock div{display:none}
#arlinablock .fixblock div.active{display:block}
#arlinablock ol{margin-left:20px}
@media(max-width:768px){#arlinablock .inner{width:calc(100% - 20px);margin:10px auto;padding:15px}}

Javascript

Phần link javascript này đã được đặt trong mã javascript chỉ tải khi cuộn trang để không làm chậm tốc độ load trang. Bạn dán trước thẻ </body> và nên tải về up lên host riêng tránh dùng chung.

<script>/*<![CDATA[*/  
     // Say Hi to Adblock
      window.addEventListener("load",function(){function a(){if(0==b){b=1;var a=document.createElement("script");a.async=!0,a.src="https://raw.githack.com/dtbvoz/nz/main/tbadblock.js";var c=document.getElementsByTagName("script")[0];c.parentNode.insertBefore(a,c)}}var b=0;window.addEventListener("scroll",function(){a()})});
      /*]]>*/</script>

Các lựa chọn thay thế Google Adsense tốt nhất cho người viết blog

noreply@blogger.com (Unknown) — Mon, 04 Dec 2023 21:57:00 +0000

Bài viết này sẽ khám phá các mạng quảng cáo hoặc tiếp thị liên kết thay thế Google Adsense tốt nhất sẽ giúp bạn kiếm tiền trong việc lựa chọn quảng cáo thay cho Adsene dùng cho trang web của mình.

Thực sự có một số lý do để suy nghĩ về các lựa chọn thay thế Google Adsense:

Vì nhiều lý do nào đó bạn không thể đăng ký được tài khoản Adsense hoặc blog của bạn không phù hợp với mạng quảng cáo Adsense của Google.

Khoản thanh toán: Google Adsense có khoản thanh toán tối thiểu là 100 đô la. Một số mạng thay thế tự hào giảm các khoản thanh toán tối thiểu, với một số ít nhất là 10 đô la.

Tiêu chí đủ điều kiện: Hầu hết các mạng quảng cáo yêu cầu các trang web phải đạt được các số liệu nhất định trước khi trở thành thành viên của mạng. Các mạng nhỏ hơn có thể cần giảm các yêu cầu về tính đủ điều kiện so với Google Adsense.

Rút tiền thanh toán: Hầu hết các mạng quảng cáo giữ cho nhà xuất bản theo chu kỳ thanh toán 30 ngày, tuy nhiên, một số mạng có thể bao gồm thời gian quay vòng kéo dài hoặc ngắn hơn.

Thu nhập từ quảng cáo (Chia sẻ doanh thu): Là nhà xuất bản Google Adsense, bạn nhận được 68% thu nhập từ quảng cáo trên trang web của mình. Một số mạng nhỏ hơn cung cấp phí cao hơn.

Tùy chỉnh quảng cáo: Các mạng quảng cáo khác nhau thường cho phép bạn tùy chỉnh giao diện của quảng cáo để phù hợp hơn với chủ đề trang web của bạn.

Top các lựa chọn thay thế Google Adsense tốt nhất cho người viết blog

1- Infolinks

Lượt xem tối thiểu: Không bắt buộc.

Chia sẻ thu nhập: 70%

Xuất chi: Xuất chi tối thiểu 50 đô la, cứ sau 45 ngày.

Tại sao nên sử dụng InfoLinks thay thế cho Google Adsense: Giảm khoản thanh toán tối thiểu.

InfoLinks hơi khác một chút so với các quảng cáo hiển thị cũ: chúng tập trung vào các siêu liên kết trong văn bản. Chuyên môn của họ tìm kiếm trang web của bạn để tìm từ khóa và đặt liên kết đến các dịch vụ và sản phẩm có liên quan trong tài liệu nội dung của bạn.

Ngoài ra, InfoLinks còn cung cấp một số lợi ích rõ ràng cho những người sáng tạo nhỏ. Không có yêu cầu về lượt xem tối thiểu và bạn chỉ cần kiếm được 50 đô la để được trả tiền.

Bạn sẽ có thể chọn nhận thanh toán InfoLinks qua PayPal, Payoneer hoặc Western Union.

2- SkimLinks

Lượt xem tối thiểu: Không bắt buộc.

Chia sẻ doanh thu: 75%

Thanh toán: Thanh toán hàng tháng. Chạy theo chu kỳ 90 ngày, Tối thiểu $10

Tại sao nên sử dụng SkimLinks thay thế cho Google Adsense: Xuất chi tối thiểu thấp hơn.

SkimLinks hoạt động bằng cách tìm kiếm nội dung của bạn để tìm các liên kết hiện có tới các đối tác của họ và biến chúng thành các siêu liên kết liên kết. Ví dụ: nếu bạn có liên kết đến Mục tiêu, họ sẽ biến liên kết đó thành siêu liên kết liên kết. Sau đó, bạn sẽ kiếm được 75% thu nhập từ liên kết đó.

SkimLinks giành được vị trí có lẽ là tùy chọn thay thế Google Adsense tốt nhất bằng cách thương lượng các khoản phí duy nhất với các nhà sản xuất lớn. Nhiều thương hiệu trong số đó có các gói liên kết của riêng họ, tuy nhiên, bạn có thể kiếm được gấp đôi số tiền bằng cách sử dụng SkimLinks.

3- PropellerAds

Lượt xem tối thiểu: Không bắt buộc.

Chia sẻ doanh thu: 80%

Xuất chi: Thanh toán hàng tuần. Tối thiểu $5.

Tại sao nên sử dụng PropellerAds thay thế cho Google Adsense: Khoản thanh toán tối thiểu thấp hơn đáng kể và tính linh hoạt để nhận hoa hồng hàng tuần.

PropellerAds có vẻ như là một lựa chọn tuyệt vời cho các chủ doanh nghiệp nhỏ. Không có bất kỳ phụ thuộc vào lượt xem tối thiểu nào, tỷ lệ chia sẻ doanh thu cao và khoản thanh toán tối thiểu thấp. Tiền hàng tuần cũng là một lợi ích thú vị.

Thanh toán PropellerAds qua PayPal, Payoneer, Webmoney, Thanh toán điện tử, chuyển khoản ngân hàng hoặc thẻ tín dụng. Tuy nhiên, chuyển khoản ngân hàng có giá 50 đô la.

4- Amazon Native Ads

Lượt xem tối thiểu: Không bắt buộc.

Chia sẻ doanh thu: 4-8%

Xuất chi: Xuất chi tối thiểu 100 đô la, Thanh toán được thực hiện sau 60 ngày kể từ ngày mua.

Tại sao nên sử dụng Quảng cáo mua sắm gốc của Amazon thay thế cho Google Adsense: Bạn đã là Đơn vị liên kết của Amazon và cần tối đa hóa các khoản thu nhập đó.

Quảng cáo mua sắm gốc của Amazon cực kỳ tập trung vào quảng cáo thương mại điện tử. Họ sử dụng cấu trúc chi phí giống như Amazon Associates, trả tiền cho bạn dựa trên tổng doanh thu hơn là lượt xem. Bạn phải là một Chi nhánh của Amazon để sử dụng các quảng cáo này.

5) Sovrn//Commerce

Lượt xem tối thiểu: Không bắt buộc.

Chia sẻ doanh thu: Chủ yếu dựa trên các doanh nghiệp.

Xuất chi: Tối thiểu $10

Tại sao nên sử dụng Sovern //Commerce thay thế cho Google Adsense: Thanh toán tối thiểu thấp hơn.

Sovrn // Commerce, trước đây thường được gọi là Viglinks, cung cấp dịch vụ tương tự cho SkimLinks. Chuyên môn của họ tìm kiếm trên trang web của bạn các siêu liên kết đến các sản phẩm từ các công ty mà họ hợp tác và biến các siêu liên kết này thành các liên kết liên kết. Bạn kiếm được tiền hoa hồng chủ yếu dựa trên lượt mua hàng của các cá nhân chứ không phải lượt xem.

6- Media.Net

Lượt xem tối thiểu: Không bắt buộc nhưng người xem của bạn phải chủ yếu ở Hoa Kỳ, Vương quốc Anh và Canada.

Chia sẻ doanh thu: Chủ yếu dựa vào nhà quảng cáo.

Thanh toán: Thanh toán tối thiểu $100.

Tại sao nên sử dụng Media.net thay thế cho Google Adsense: Một số lượng lớn các loại quảng cáo.

Media.net cho phép các nhà xuất bản kiếm tiền từ nhiều loại quảng cáo khác nhau. Những quảng cáo này sử dụng cơ sở của Yahoo! Mạng Bing để chỉ ra cho mọi người các liên kết liên quan đến các cụm từ mà họ thường tìm kiếm.

7- Bidvertiser

Lượt xem tối thiểu: Không bắt buộc

Chia sẻ thu nhập: Không xác định

Thanh toán: Tối thiểu 10 đô la cho PayPal, 100 đô la cho séc, 500 đô la cho chuyển khoản ngân hàng.

Tại sao nên sử dụng Bidvertiser thay thế cho Google Adsense: Thanh toán tối thiểu thấp hơn/

Bidvertiser là mạng quảng cáo trực tiếp giúp tìm kiếm sự phù hợp hiệu quả nhất giữa nhà quảng cáo và nhà xuất bản.

Bằng cách sử dụng các nguồn khách truy cập được sàng lọc trước có thể hướng đến việc tạo chuyển đổi, Bidvertiser cho phép bạn tận dụng lợi thế từ các quảng cáo của mình. Tất cả khách truy cập hoàn toàn được phân đoạn để quản lý và tối ưu hóa quảng cáo của bạn tập trung vào.
Nó cũng cung cấp một chương trình giới thiệu trả tiền cho các lượt giới thiệu của từng nhà quảng cáo và nhà xuất bản, điều đó có nghĩa là mạng quảng cáo của bạn sẽ tiếp tục báo trước thu nhập thụ động.

8- Adsterra

Lượt xem tối thiểu: Không bắt buộc

Chia sẻ doanh thu: Không xác định

Thanh toán: Thanh toán tối thiểu là 5 đô la cho Paxum và Webmoney, 100 đô la cho PayPal và Bitcoin và 1.000 đô la cho chuyển khoản ngân hàng.

Tại sao nên sử dụng Adsterra thay thế cho Google Adsense: thanh toán được thực hiện sau 15 ngày. Khi bạn sử dụng Paxum hoặc Webmoney, bạn cũng có thể hưởng lợi từ chi phí tối thiểu thấp.

Adsterra cung cấp Mô hình quảng cáo CPC, CPM và CPA để tối đa hóa thu nhập từ quảng cáo. Nó cung cấp các lựa chọn quảng cáo mang tính cách mạng đang sử dụng bí quyết Tối ưu hóa Quảng cáo hoạt động để mang lại chuyển đổi ngày càng tăng cho mọi nhà quảng cáo và Nhà xuất bản. Adsterra phục vụ khá nhiều codec quảng cáo cho web và nền tảng di động để tối đa hóa doanh thu quảng cáo của bạn.

Hướng dẫn cài đặt nút back to top với tiến trình (progress) cho blogspot/blogger

noreply@blogger.com (Unknown) — Mon, 04 Dec 2023 17:15:00 +0000

Cách thêm nút quay lại đầu trang hay thường gọi là back to top với tiến trình (progress) trên trang web Blogger: Nút quay lại đầu trang với tiến trình có chức năng tương tự như nút back to top mọi người vẫn dùng chỉ có khác là trong quá trình cuộn trang trên nút thể hiện tiến trình phần trăm trang đã cuộn qua.

Và ưu điểm của code này là chỉ dùng javascript mà không cần sử dụng thư viện jquery hỗ trợ nên có thể đáp ứng được yêu cầu với nhiều người thiên về css.

Như chúng ta biết nút quay lại đầu trang hay thường gọi là back to top nó đóng một vai trò quan trọng trong trải nghiệm trên trang. Nó giúp người dùng quay lại đầu trang chỉ với một cái nhấp chuột và điều này cải thiện tốt trải nghiệm người dùng.

Demo
Và bây giờ hãy làm theo các bước để cài đặt Nút Quay lại Đầu trang có Tiến trình trên Trang web Blogger.
Bước 1: Đi tới Trang tổng quan Blogger.
Bước 2: Hãy nhấp vào Chủ đề> Chỉnh sửa HTML.
Bước 3: Sao chép mã css dán vào phần css của blog.

.btotop {
	position: fixed;
	right: 30px;
	bottom: 30px;
	height: 40px;
	width: 40px;
	cursor: pointer;
	display: block;
	border-radius: 50px;
	box-shadow: inset  0 0 0 2px #ddd;
	z-index: 10000;
	opacity: 0;
	visibility: hidden;
	transform: translateY(25px);
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}
.btotop.active-progress {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}
.btotop::after {
	position: absolute;
	content: '🠅';
	text-align: center;
	line-height: 40px;
	font-size: 18px;
	color: #666;
	left: 0;
	top: 0;
	height: 40px;
	width: 40px;
	cursor: pointer;
	display: block;
	z-index: 1;
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}
.btotop:hover::after {
	opacity: 0;
}

.btotop::before {
	position: absolute;
	content: '🠅';
	text-align: center;
	line-height: 40px;
	font-size: 18px;
	opacity: 0;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	left: 0;
	top: 0;
	height: 40px;
	width: 40px;
	cursor: pointer;
	display: block;
	z-index: 2;
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}
.btotop:hover::before {
	opacity: 1;
}
.btotop svg path { 
	fill: none;
}
.btotop svg.progress-circle path {
	stroke: #ff0000;
	stroke-width: 4;
	box-sizing:border-box;
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}
.btotop svg{width:40px;height:40px}
.darkMode .btotop::after{color:#ddd}
.darkMode .btotop{background:#333;box-shadow: inset  0 0 0 2px #ff0000}
.darkMode .btotop svg.progress-circle path{stroke: #fff}

Bước 4: Dán javascript vào trước thẻ đóng </body>

<script>/*<![CDATA[*/
// back to top with progress
let progressPath = document.querySelector('.btotop path');
let pathLength = progressPath.getTotalLength();
progressPath.style.transition = progressPath.style.WebkitTransition = 'none';
progressPath.style.strokeDasharray = pathLength + ' ' + pathLength;
progressPath.style.strokeDashoffset = pathLength;
progressPath.getBoundingClientRect();
progressPath.style.transition = progressPath.style.WebkitTransition = 'stroke-dashoffset 10ms linear';	
let updateProgress = function () {
  let scroll = window.scrollY;
	let height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
  let progress = pathLength - (scroll * pathLength / height);
	progressPath.style.strokeDashoffset = progress;
}

updateProgress();
window.onscroll = function(){updateProgress()};
let offset = 50;
let duration = 550;
let progress = document.getElementsByClassName('btotop');
window.addEventListener("scroll", function() {
  if(window.scrollY > offset) {
     Array.from(progress).forEach(function(pro) {
        pro.classList.add('active-progress');
     })
  } else {
     Array.from(progress).forEach(function(pro) {
        pro.classList.remove('active-progress');
     })
  }
});

Array.from(progress).forEach(function(e) {
  e.addEventListener('click', function(event) {
    event.preventDefault();
    window.scrollTo({top: 0, behavior: 'smooth'});
    return false;
  });
})
/*]]>*/</script>

Bước 5: Cuối cùng là dán code HTML sau vào trước </body>

<div class='btotop'>
		<svg class='progress-circle' height='100%' viewBox='-1 -1 102 102' width='100%'>
			<path d='M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98'/>
		</svg>
	</div>

Trong phần css có class "darkMode" có thể khác nhau với các template vì vậy chỉnh sửa cho phù hợp.

Thủ thuật chèn nhiều mã quảng cáo giữa bài viết có tùy chỉnh vị trí cho blogspot

noreply@blogger.com (Unknown) — Mon, 04 Dec 2023 09:32:00 +0000

Bạn cần tự động đặt mã quảng cáo ở các vị trí tùy chỉnh trong bài viết theo lần xuống dòng với thẻ <br/> hoặc <p> hay theo phần trăm độ dài bài viết. Vậy bài viết sau đây sẽ giúp bạn thực hiện được điều mong muốn đó.

Tự động cài đặt mã quảng cáo Adsense vào giữa bài viết blogspot/blogger có thể tùy chỉnh vị trí theo số lần xuống dòng <br/> hoặc <p>......</p> là vấn đề quan tâm của nhiều người.

Chèn sao cho tối ưu, phù hợp vị trí là điều nhiều người mong muốn. Việc chèn được nhiều quảng cáo vào trong bài viết ở các vị trí chỉ định trước là điều không hề đơn giản. Bài này hướng dẫn các bạn 4 cách chèn quảng cáo vào giữa bài viết.

+ Cách 1: Chèn 4 quảng cáo vào trong bài viết với 2 vị trí trên cùng sau tiêu đề và dưới cùng cuối bài viết, cộng thêm 2 vị trí ở giữa bài viết có thể tùy chỉnh vị trí theo số lần xuống dòng(p, br) của bài viết.
+ Cách 2: Tự động chèn quảng vào trong nội dung bài viết như cách 1 nhưng chỉnh vị trí theo phần trăm độ dài bài viết.
+ Cách 3: Tự động chèn nhiều quảng cáo Adsense vào giữa bài viết tùy chỉnh vị trí.
+ Cách 4: Tự động chèn duy nhất 1 vị trí quảng cáo ở giữa bài viết.

I- Chèn quảng cáo giữa bài viết tùy chỉnh vị trí theo thẻ p hoặc br

Bước 1 Thêm CSS

.postAdin .widget,.postAdin  .widget-content{margin:0 !important;padding 0}
.postAdin h2{display:none !important}
#coke-postad0 ins,#coke-postad1 ins,#coke-postad2 ins,#coke-postad3 ins{margin:20px 0}
.post-body #coke-postad0,.post-body #coke-postad1,.post-body #coke-postad2,.post-body #coke-postad3{text-align:center;display:block}

Bước 2 Thêm Tiện ích.Thêm vào ngay sau thẻ đóng </b:section> của phần main như hình

<b:section class='postAdin' id='PostAdin0' maxwidgets='1' showaddelement='yes'>
              <b:widget id='HTML996' locked='true' title='Ads in post custom' type='HTML' version='1'>
                <b:widget-settings>
                  <b:widget-setting name='content'/>
                </b:widget-settings>
                <b:includable id='main'>
   <b:if cond='data:blog.pageType in {&quot;item&quot;}'>
   <!-- only display title if it's non-empty -->
   <b:if cond='data:title != &quot;&quot;'>
  <h2 class='title'><data:title/></h2>
   </b:if>
   <div class='widget-content'>
     <div id='coke-postad0'>
  <data:content/>
  </div>
   </div>
   </b:if>
   
   </b:includable>
              </b:widget>
            </b:section>  
  <b:section class='postAdin' id='PostAdin1' maxwidgets='1' showaddelement='yes'>
      <b:widget id='HTML997' locked='true' title='Ads in post custom-1' type='HTML' version='1'>
        <b:widget-settings>
          <b:widget-setting name='content'/>
        </b:widget-settings>
        <b:includable id='main'>
   <b:if cond='data:blog.pageType in {&quot;item&quot;}'>
   <!-- only display title if it's non-empty -->
   <b:if cond='data:title != &quot;&quot;'>
  <h2 class='title'><data:title/></h2>
   </b:if>
   <div class='widget-content'>
     <div id='coke-postad1'>
  <data:content/>
  </div>
   </div>
   </b:if>
   </b:includable>
      </b:widget>
    </b:section>
  <b:section class='postAdin' id='PostAdin2' maxwidgets='1' showaddelement='yes'>
    <b:widget id='HTML998' locked='true' title='Ads in post custom-2' type='HTML' version='1'>
      <b:widget-settings>
        <b:widget-setting name='content'/>
      </b:widget-settings>
      <b:includable id='main'>
   <b:if cond='data:blog.pageType in {&quot;item&quot;}'>
   <!-- only display title if it's non-empty -->
   <b:if cond='data:title != &quot;&quot;'>
  <h2 class='title'><data:title/></h2>
   </b:if>
   <div class='widget-content'>
     <div id='coke-postad2'>
  <data:content/>
  </div>
   </div>
   </b:if>
   </b:includable>
    </b:widget>
  </b:section>
  <b:section class='postAdin' id='PostAdin3' maxwidgets='1' showaddelement='yes'>
    <b:widget id='HTML999' locked='true' title='Ads in post custom-3' type='HTML' version='1'>
      <b:widget-settings>
        <b:widget-setting name='content'/>
      </b:widget-settings>
      <b:includable id='main'>
   <b:if cond='data:blog.pageType in {&quot;item&quot;}'>
   <!-- only display title if it's non-empty -->
   <b:if cond='data:title != &quot;&quot;'>
  <h2 class='title'><data:title/></h2>
   </b:if>
   <div class='widget-content'>
     <div id='coke-postad3'>
  <data:content/>
  </div>
   </div>
   </b:if>
   
   </b:includable>
    </b:widget>
  </b:section>

Lưu ý: Không được xóa tiêu đề tiện ích.
Code HTML trên là dùng cho template verson 1, hiện nay chủ yếu dùng verson 2 thì code này cần thay đổi một chút như dưới.

<b:section class='postAdin' id='PostAdin0' showaddelement='false'>
        <b:widget cond='data:view.isPost' id='HTML996' locked='true' title='Ads in post custom' type='HTML' version='2' visible='true'>
          <b:widget-settings>
            <b:widget-setting name='content'/>
          </b:widget-settings>
          <b:includable id='main'>
              <b:include name='widget-title'/>
                <div class='widget-content'>
                  <div id='coke-postad0'>
                   <data:content/>
                  </div>
                </div>
             </b:includable>
        </b:widget>
      </b:section>

Tại phần CSS cần đổi h2 thành h3, trong chỉnh sửa cần chính xác nếu không code không hoạt động.
Đây là ví dụ cho 1 section, các section khác cũng tương tự.
Bước 3 Thêm javascript vào trước thẻ đóng </body>

<b:if cond='data:view.isPost'>
<script>/*<![CDATA[*/
function insertAfter(addition, konten) {
    var parent = konten.parentNode;
    if (parent.lastChild == konten) {
        parent.appendChild(addition);
    } else {
        parent.insertBefore(addition, konten.nextSibling);
    }
}
function insertAbove(addition, konten) {
    var parent = konten.parentNode;
 parent.insertBefore(addition, konten);
}
function insertBellow(addition) {
    var parent = konten;
 parent.appendChild(addition);
}
var tdb0 = document.getElementById("coke-postad0");
var tdb1 = document.getElementById("coke-postad1");
var tdb2 = document.getElementById("coke-postad2");
var tdb3 = document.getElementById("coke-postad3");
var konten = document.getElementById("body-post-it");
var lokasi = konten.getElementsByTagName("br");
if (lokasi.length > 0) {
 insertAbove(tdb0,konten); 
 insertBellow(tdb3);
} 
if (lokasi.length > 3) {
    insertAfter(tdb1,lokasi[3]);
} 
else {
 tdb1.innerHTML = "";
}
if (lokasi.length > 10) {
    insertAfter(tdb2,lokasi[10]);
} 
else {
 tdb2.innerHTML = "";
}
/*]]>*/</script>
</b:if>

Ở đây mặc định atdbg0 và atdbg3 là một ở trên đầu và một ở cuối cùng bài biết, còn lại atdbg1 và atdbg2 là 2 cái nằm ở giữa bài viết có thể căn chỉnh theo lần xuống dòng <br/> của bài viết bằng cách căn các giá trị 3 và 10 theo ý thích. Nếu blog dùng thẻ <p> thì có thể thay br trong code thành p.
Ví dụ 3 là quảng cáo sẽ xuất hiện tại vị trí xuống dòng lần thứ 3.
Bước 4
Để code hoạt động được bạn cần thay

<data:post.body/>

Thành

<div id='body-post-it'>
<data:post.body/>
</div>

Bước 5
Bạn chỉ việc vào bố cục tìm các tiện ích sau đó dán code quảng cáo vào rồi lưu lại.
Mặc định là có 4 tiện ích ở 4 vị trí nhưng dùng bao nhiêu cái ở vị trì nào thì bỏ code QC vào tiện ích đó còn không dùng cái nào thì tắt cái đó đi.
Lưu ý
Nếu bạn muốn có nhiều hơn 2 vị trí để tùy chỉnh thì bằng cách sửa lại chút javascript để 2 vị trí 0 và 3 không là đầu và cuối mà có thể tùy chỉnh như 1 và 2.
Có thể kết hợp bài này và bài Tại đây
Với việc gộp 2 đoạn javascript lại với nhau để có 2 in 1

II- Chèn quảng cáo giữa bài viết tùy chỉnh vị trí theo phần trăm độ dài bài viết

Code này blog dùng thẻ br hay p để xuống dòng đều dùng ngay được không cần sửa code.

DEMO

Bước 1 Thêm CSS

#ad-ct1,#ad-ct2,.ads2{margin:10px auto;display:inline-block;width:100%;}
.ads1{float:left;margin-bottom:10px;width:100%}

Bước 2 Thêm javascript vào trước thẻ </body>

<b:if cond='data:view.isPost'>
<script>/*<![CDATA[*/
     function insertAfter(tbh,tgt) {
       var prt = tgt.parentNode;
       if (prt.lastChild == tgt) {prt.appendChild(tbh);} 
       else {prt.insertBefore(tbh,tgt.nextSibling);}}
       var tgt = document.getElementById("konten"); 
       var ad1 = document.getElementById("ad-ct1");
       var ad2 = document.getElementById("ad-ct2");
       var tg1 = tgt.getElementsByTagName("p"); 
       var tg2 = tgt.getElementsByTagName("br");   
       var pt1 = tg1.length; var pt2 = tg2.length; 
       var ps1 = pt1*20/100; var ps2 = pt1*65/100;
       var br1 = pt2*20/100; var br2 = pt2*65/100;
       var bl1 = Math.round(ps1); var bl2 = Math.round(ps2);
       var bk1 = Math.round(br1); var bk2 = Math.round(br2);
       if (pt1 > 2) {
           insertAfter(ad1,tg1[bl1-1]); insertAfter(ad2,tg1[bl2-1]);
       } else if (br2 > 1) {
           insertAfter(ad1,tg2[bk1-1]); insertAfter(ad2,tg2[bk2-1]);
       } else {}
     /*]]>*/</script>
</b:if>

Trong đó:
Trị số 20 tùy chỉnh cho ads thứ 2 trong 4 mã ads
Trị số 60 tùy chỉnh cho ads thứ 3 trong 4 mã ads
Ads thứ nhất và thứ 4 mặc định là ở đầu và cuối bài viết
Bước 3 Cài đặt phần HTML
Tìm thẻ <data:post.body/> sẽ có vài thẻ như vậy nên đành phải thử từng thẻ(Nhớ lưu mẫu trước đề phòng sai sót) và thay nó bằng đoạn HTML sau

<div class='ads1'>
<!-- Mã QC dán ở đây(Ad top) -->
</div>
<div id='ad-ct1'>
<!-- Mã QC dán ở đây(Tùy chỉnh) -->
</div>
<div id='konten'>
<data:post.body/>
</div>
<div id='ad-ct2'>
<div style='clear:both;'>
<!-- Mã QC dán ở đây(Tùy chỉnh) -->
</div>
</div>
<div class='ads2'>
<!-- Mã QC dán ở đây(Ad bottom) -->
</div>

Lưu ý:
Với những mẫu blogspot chia sẻ ví dụ như mẫu Litepost họ đã tích hợp sẵn 2 vị trí top và bottom là 2 tiện ích thường ở ngay dưới bài đăng trên blog trong phần bố cục thì nên bỏ đi 2 khu vực là ads1 và ads2 chỉ giữ lại 2 cái có thể tùy chỉnh vị trí trong code HTML ở trên.

III- Chèn nhiều quảng cáo trong bài viết tùy chỉnh vị trí

Vào chỉnh sửa mẫu tìm tới thẻ đóng </b:section> của phần main nó như bên dưới(kết thúc phần main Blog1)

</b:section>
          </main>

Và thêm vào trước nó những widget để chứa quảng cáo.

<b:widget cond='data:view.isPost and !data:view.isPreview' id='HTML01' locked='true' title='Middle Post Ad 01' type='HTML' version='2' visible='true'>
                <b:widget-settings>
                  <b:widget-setting name='content'></b:widget-setting>
                </b:widget-settings>
                <b:includable id='main'>
                  <div class='widget-content'>
                    <!--[ Middle article Ad ]-->                      
                    <data:content/>
                    
                    <!--[ Script to move widget to the middle of article ]-->
                    <script>/*<![CDATA[*/ function insertAfter(tbh,tgt) {var prt = tgt.parentNode; if (prt.lastChild == tgt) {prt.appendChild(tbh);} else {prt.insertBefore(tbh,tgt.nextSibling);}} var tgt = document.getElementById("postBody"); var midAd01 = document.getElementById("HTML01"); var showAd01 = tgt.getElementsByTagName("br"); if (showAd01.length > 0) {insertAfter(midAd01,showAd01[1]);}; /*]]>*/</script>
                  </div>
                </b:includable>
              </b:widget>
              <b:widget cond='data:view.isPost and !data:view.isPreview' id='HTML02' locked='true' title='Middle Post Ad 02' type='HTML' version='2' visible='true'>
                <b:widget-settings>
                  <b:widget-setting name='content'></b:widget-setting>
                </b:widget-settings>
                <b:includable id='main'>
                  <div class='widget-content'>
                    <!--[ Middle article Ad ]-->                      
                    <data:content/>
                      
                    <!--[ Script to move widget to the middle of article ]-->
                    <script>/*<![CDATA[*/ function insertAfter(tbh,tgt) {var prt = tgt.parentNode; if (prt.lastChild == tgt) {prt.appendChild(tbh);} else {prt.insertBefore(tbh,tgt.nextSibling);}} var tgt = document.getElementById("postBody"); var midAd02 = document.getElementById("HTML02"); var showAd02 = tgt.getElementsByTagName("br"); if (showAd02.length > 0) {insertAfter(midAd02,showAd02[9]);}; /*]]>*/</script>
                  </div>
                </b:includable>
              </b:widget>
              <b:widget cond='data:view.isPost and !data:view.isPreview' id='HTML03' locked='true' title='Middle Post Ad 03' type='HTML' version='2' visible='true'>
                <b:widget-settings>
                  <b:widget-setting name='content'></b:widget-setting>
                </b:widget-settings>
                <b:includable id='main'>
                  <div class='widget-content'>
                    <!--[ Middle article Ad ]-->                      
                    <data:content/>
                      
                    <!--[ Script to move widget to the middle of article ]-->
                    <script>/*<![CDATA[*/ function insertAfter(tbh,tgt) {var prt = tgt.parentNode; if (prt.lastChild == tgt) {prt.appendChild(tbh);} else {prt.insertBefore(tbh,tgt.nextSibling);}} var tgt = document.getElementById("postBody"); var midAd03 = document.getElementById("HTML03"); var showAd03 = tgt.getElementsByTagName("br"); if (showAd03.length > 0) {insertAfter(midAd03,showAd03[29]);}; /*]]>*/</script>
                  </div>
                </b:includable>
              </b:widget>
              <b:widget cond='data:view.isPost and !data:view.isPreview' id='HTML04' locked='true' title='Middle Post Ad 04' type='HTML' version='2' visible='true'>
                <b:widget-settings>
                  <b:widget-setting name='content'></b:widget-setting>
                </b:widget-settings>
                <b:includable id='main'>
                  <div class='widget-content'>
                    <!--[ Middle article Ad ]-->                      
                    <data:content/>
                      
                    <!--[ Script to move widget to the middle of article ]-->
                    <script>/*<![CDATA[*/ function insertAfter(tbh,tgt) {var prt = tgt.parentNode; if (prt.lastChild == tgt) {prt.appendChild(tbh);} else {prt.insertBefore(tbh,tgt.nextSibling);}} var tgt = document.getElementById("postBody"); var midAd04 = document.getElementById("HTML04"); var showAd04 = tgt.getElementsByTagName("br"); if (showAd04.length > 0) {insertAfter(midAd04,showAd04[49]);}; /*]]>*/</script>
                  </div>
                </b:includable>
              </b:widget>

Ở đây là 4 widget có thể thêm hoặc bớt tùy nhu cầu nếu thêm thì thì thêm 1 widget ngay sau HTML04 và sửa tất cả là 05. và lưu ý không để trùng lặp ID HTML. Nếu blog dùng thẻ p để xuống dòng thì đổi br trong js thành p. Sau đó vào bố cục để thêm code QC vào tiện ích vừa tạo và điều chỉnh vị trí QC bằng cách thay đổi trị số ví dụ ở code mẫu là 49.

{insertAfter(midAd04,showAd04[49]);}

Kiểm tra xem thẻ div bao thẻ <data:post.body/> đã có id='postBody' chưa nếu chưa có mà chỉ có class thì thêm id='postBody' vào.
Trường hợp có class và id nhưng id không phải là postBody thì nên sửa 'postBody' trong javascript của code giống với id trong thẻ div của mẫu và nhớ sửa tất cả các javascript trong các widget đã thêm vào.

IV- Chèn duy nhất 1 vị trí quảng cáo ở giữa bài viết

Bước 1: Đăng nhập Blogger ~> Vào Mẫu ~> Chỉnh sửa HTML
Tìm đến thẻ hiển thị nội dung bài viết <data:post.body/> và thay thẻ này bằng đoạn code sau
Lưu ý:Do thiết kế template có nhiều khác nhau nên thẻ trên có thể không nằm trong thẻ điều kiện nào nhưng cũng có thể nằm trong thẻ điều kiện do vậy chú ý thẻ nằm trong thẻ điều kiện chỉ xuất hiện ở trang bài viết(item)

<div expr:id='&quot;zet1&quot; + data:post.id'/>
<div class='googlezet'>
Chèn code quảng cáo của bạn ở đây
</div>
<div expr:id='&quot;zet2&quot; + data:post.id'><p><data:post.body/></p></div>
<script type='text/javascript'>
var obj0=document.getElementById(&quot;zet1<data:post.id/>&quot;);var obj1=document.getElementById(&quot;zet2<data:post.id/>&quot;);var s=obj1.innerHTML;var t=s.substr(0,s.length/2);var r=t.lastIndexOf(&quot;&lt;br&gt;&quot;);if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+16);}
</script>

Bước 2: Thêm đoạn css này vào trước thẻ đóng ]]></b:skin>

.googlezet{margin:15px auto;text-align:center}

Mẫu blogger cao cấp Starter Premium miễn phí tải về

noreply@blogger.com (Unknown) — Sun, 03 Dec 2023 23:35:00 +0000

Starter Premium - Tải xuống miễn phí mẫu Blogger đáp ứng. Starter là một Mẫu Blogger đáp ứng chuyên nghiệp. Starter thân thiện với thiết bị di động, nó cũng hoàn toàn tương thích với Google AdSense và các nền tảng kiếm tiền khác.

Mẫu Blogger Starter Premium rất phù hợp với người mới bắt đầu sử dụng blogger vì nó đơn giản, tải nhanh và được tối ưu hóa hoàn toàn cho các công cụ tìm kiếm. Nó siêu sạch vì không mã hóa và không cài link dẫn đến trang đích không mong muốn.

Những tính năng cơ bản

Thiết kế đáp ứng hoàn toàn (Thân thiện với thiết bị di động)
Hỗ trợ cho tất cả các ngôn ngữ Blogger (được hỗ trợ RTL)
Chế độ tối
Hỗ trợ logo image ở chế độ tối(dark)
Hỗ trợ chế độ đóng hộp
Menu Mega chuyên nghiệp
Quảng cáo nâng cao
Mục lục-Table of Contents
Video nhúng YouTube thích ứng
Bình luận của Disqus và Facebook
Nhúng video và hình ảnh vào bình luận thông qua liên kết.
Phần Giới thiệu chuyên nghiệp (Hỗ trợ Logo tối)
Sự đồng ý của Native Cookie
Tải nhanh
Thân thiện với AdSense
Tối ưu hóa SEO bởi nhóm chuyên gia về Mẫu Blogger chuyên nghiệp
Nền, độ rộng, màu sắc và phông chữ có thể tùy chỉnh hoàn toàn
Không mã hóa tín dụng chân trang.

Cách thêm mục lục vào bài viết
Chức năng này có sẵn cho các bài đăng và trang và có thể được thêm dễ dàng thông qua shortcode.
Shortcode:

<b>{getToc} $title={Table of Contents}</b>

Xem trước và tải về

Demo

Starter premium.zip 37.5 KB

Những ưu điểm của chiến lược tiếp thị liên kết trong lĩnh vực kiếm tiền trực tuyến

noreply@blogger.com (Unknown) — Sun, 03 Dec 2023 13:11:00 +0000

Tiếp thị liên kết là một công việc phức tạp đối với nhiều người. Một số người có thể chạy thành công một chiến dịch tiếp thị liên kết , trong khi những người khác dường như không thể tạo ra một cỗ máy tiếp thị trực tuyến. Một số người rất thành công trong lĩnh vực tiếp thị liên kết, trong khi những người khác dường như gặp khó khăn.

Sau đây là những lợi ích của tiếp thị liên kết.

1. Tiếp thị liên kết đòi hỏi ít hoặc không cần tiền để bắt đầu.

2. Công việc của bạn chỉ đơn giản là giới thiệu cho mọi người những lời mời chào sản phẩm của các công ty khác. Các sản phẩm chào hàng trong tiếp thị liên kết thường được nghiên cứu và phê duyệt trước khi thực hiện.

Mỗi công ty sẽ có những ưu đãi riêng, bạn có thể tìm thấy thông tin này ở cuối trang web của mình. Khi bạn tìm thấy một ưu đãi mà bạn thích, bạn chỉ cần tham gia chương trình liên kết của nó bằng cách nhấp vào liên kết đặc biệt của nó.

Sau khi bạn thực hiện nghiên cứu của mình và tùy thuộc vào công ty, liên kết của bạn sẽ được nhấp vào. Bạn sẽ được gửi thông tin về sản phẩm hoặc nó sẽ chứa một mã đặc biệt sẽ được cung cấp tự động cho bạn.

Nếu bạn biết chắc chắn, bạn sẽ có thể theo dõi điều này thông qua các cookie đặc biệt có thể được đặt trên máy tính của khách truy cập.

3. Bạn có thể chạy nhiều chiến dịch, một số chiến dịch rõ ràng sẽ thành công và một số chiến dịch thì không. Nhưng bạn sẽ biết điều này về các chiến dịch của mình vì bạn sẽ được chủ sở hữu sản phẩm hoặc người bán cá nhân chứng minh rằng đó là một chiến dịch thành công.

4. Mặc dù bạn sẽ được yêu cầu đặt sản phẩm trên trang web của bạn để người mua xem và có thể mua, bạn sẽ không cần phải ở đó để làm điều này. Điều này được thực hiện bởi chủ sở hữu sản phẩm có sản phẩm mà bạn đang quảng cáo.

Họ sẽ trao đổi với bạn về bất kỳ khách hàng mới nào mà họ có được, những người thêm tên của họ vào danh sách. Bạn có thể giao tiếp với những người mua mới này qua điện thoại, thư hoặc email.

Không cần thiết phải gọi điện hoặc gửi email cho người mua, mặc dù bạn có thể nếu bạn muốn. Tuy nhiên, bạn nên tránh điều này vì nó có thể trở nên rất căng thẳng.

5. Bạn không cần phải có lượng truy cập lớn đến trang web của mình.

6. Bạn không cần phải xử lý một số lượng lớn các khoản thanh toán hoặc xử lý các giao dịch trả lại. Chủ sở hữu sản phẩm sẽ lo tất cả những điều này.

7. Bạn không phải đối phó với bất kỳ hoàn lại tiền hoặc khiếu nại khi mua sản phẩm trên internet. Chủ sở hữu sản phẩm thu thập tất cả các chi tiết này.

Làm thế nào để bạn quảng cáo Sản phẩm để kiếm hoa hồng?

1. Sử dụng quảng cáo Pay per Click

Bạn có thể sử dụng các dịch vụ của Google AdWords để thiết lập các chiến dịch của mình. AdWords là một lựa chọn tốt vì bạn chỉ mất phí khi ai đó nhấp vào quảng cáo của bạn.

Bạn sẽ muốn tiếp tục theo dõi các chiến dịch của mình để biết số tiền bạn đang chi tiêu và ROI (Lợi tức đầu tư) của mình. Hãy nhớ rằng đừng đặt giá thầu quá cao, nếu không bạn có thể rẻ hơn.

2. Sử dụng các trang rao vặt miễn phí

Các trang này cho phép bạn trở thành thành viên và đăng quảng cáo miễn phí. Quảng cáo của bạn sẽ được hiển thị cho những người đang tìm kiếm sở thích của họ và các danh mục liên quan.

Trang web sẽ không chịu trách nhiệm cho bất kỳ khiếu nại nào vì 98% trong số họ sẽ đơn giản để quảng cáo của bạn một mình. Điều quan trọng là phải rất cẩn thận và sử dụng các email tiếp theo thích hợp để có được doanh số bán hàng.

3. Đặt một bài báo trên EzineArticles.com

Hiệu quả của một bài báo của chính nó là tuyệt vời. Bạn có thể nhận được rất nhiều lưu lượng truy cập nếu bạn viết một bài báo 500 từ với nghiên cứu từ khóa thích hợp .

Khi bạn học cách được xếp hạng trên Google, việc viết bài sẽ giúp bạn có được lưu lượng truy cập và tạo ra doanh số bán hàng 24 giờ một ngày.

Hãy nhớ rằng, việc bạn có trang web hoặc blog không phải là điều duy nhất bạn cần làm. Để có được doanh số bán hàng và thành công, bạn sẽ cần phải quảng bá trang web liên kết và blog của mình.

Bạn có thể nhận một số tài liệu miễn phí về Tiếp thị liên kết thông qua eBay nếu bạn muốn. Bạn nên tham gia Clickbank và đọc tất cả các tài liệu miễn phí về Tiếp thị liên kết.

Có một trang web về Tiếp thị liên kết có thể được nếu bạn muốn kiếm tiền trực tuyến. Bạn sẽ nhận được một số thông tin hay và hữu ích miễn phí khi tham gia clickbank.com.

Chúc may mắn với những nỗ lực của bạn trong Tiếp thị liên kết.

Hướng dẫn cài đặt quảng cáo thị sai - Parallax Ads cho blogspot/blogger

noreply@blogger.com (Unknown) — Sat, 02 Dec 2023 22:02:00 +0000

Nếu bạn muốn tạo quảng cáo thị sai - Add a Parallax Ads cho blogger để tăng doanh thu từ Adsense thì bài viết này sẽ hướng dẫn từng bước cách thêm quảng cáo với hiệu ứng thị sai cho blogger. Vì vậy, hãy vui lòng đọc toàn bộ bài viết để tìm hiểu về cách thêm Quảng cáo thị sai trong Blogger.

Quảng cáo thị sai là gì

Thị sai là một định dạng hiển thị hấp dẫn, đẹp mắt được thiết kế cho web di động. Nó tận dụng hiệu ứng hoạt hình thị sai, nhiều lớp để thu hút sự chú ý theo một cách thú vị và không xâm phạm. Định dạng này tạo ra nhận thức độc đáo rằng các lớp hình ảnh khác nhau của quảng cáo có độ sâu khác nhau. Khi người xem cuộn qua nội dung trên điện thoại của họ, quảng cáo sẽ hiển thị đầy đủ.

DEMO

Chèn quảng cáo thị sai trên bài đăng của Blogger

Sau đây là hướng dẫn các bước thêm quảng cáo với hiệu ứng thị sai vào các bài đăng trên blog của blogger.

Thêm mã CSS vào Mẫu Blogger

Lưu mã sau trên mã </head>

<b:if cond='data:view.isPost'>
<style>
/*<![CDATA[*/
/* Paralax Ads */
.paralax{position:relative;display:block;overflow:visible;width:100%;height:0;margin:auto;text-align:center;z-index:1}
.paralax > div{overflow:hidden;width:100%;height:100%;margin:0;position:absolute;top:0;left:0;clip:rect(auto auto auto auto)}
.paralax > div > div{width:calc(100% - 40px);height:100%;position:fixed;top:0;left:0;right:0;margin:0 auto;-moz-transform:translateZ(0);-webkit-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}
.paralax > div > div > div{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-align-content:center;align-content:center;-webkit-align-items:center;-ms-flex-align:center;width:100%;height:100%;position:absolute;left:0;right:0;top:37px;align-items:center;background:transparent}
.paralax > div > div > div > *{margin:auto}
.paralax > div > div > div > a{width:100%;height:100%}
.paralax img,.paralax iframe,.paralax ins{height:100%;border:0}
.clear{clear:both;display:block}
.paralax{width:100%;min-width:300px;min-height:600px;text-align:center}
.adParallax{width:100%;min-width:300px;min-height:600px;text-align:center;display:block;margin:0;padding:0}
/*]]>*/
</style>
</b:if>

Thay đổi .drK cho phù hợp với mẫu blog của bạn

Thêm mã Html

Thêm mã sau vào ngay dưới mã <data:post.body/>

<!--[ Paralax Ads ]-->
                                      <b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>                                
                                      <b:if cond='data:view.isPost'>
                                        <div class='paralax'>
                                          <div>
                                            <div>
                                              <div>
                                                <ins class='adsbygoogle adParallax' data-ad-client='ca-pub-xxxxxxxxxxxxxxx' data-ad-format='auto' data-ad-slot='xxxxxxxxx' data-full-width-responsive='true' style='display:block'/>
                                                <script>
                                                     (adsbygoogle = window.adsbygoogle || []).push({});
                                                </script>
                                              </div>
                                            </div>
                                          </div>
                                        <span class='clear'/>
                                      </div>
                                      <script> /*<![CDATA[*/
                                     function paralax(Ad1) {let paralax = document.getElementsByClassName ('paralax')[0]; if (paralax) {let Adsp = document.querySelectorAll ('.post-body br')[Ad1 - 1]; Adsp.parentNode .insertBefore (paralax, Adsp.nextSibling)}} paralax(4);/*]]>*/</script></b:if></b:if>
                                    <!--[ Paralax Ads ]-->

Mặc định của code javascript xác định vị trí hiện quảng cáo là dùng thẻ br để xuống dòng nếu blog sử dụng thẻ p để xuống dòng thì sửa lại .post-body br thành .post-body p
Chỉ số 4 là quảng cáo sẽ được gim sau khi cuộn tới dòng thứ 4. Và thay mã QC ads vào phần bôi màu cam.
Nếu muốn quảng cáo hiện trên màn hình PC thì loại bỏ thẻ điều kiện <b:if cond='data:blog.isMobileRequest == "true"'>

Lưu ý: Đối với một số mẫu đã có thay đổi về cấu trúc thẻ <data:post.body/> ví dụ như bên dưới

<b:if cond='data:view.isSingleItem'>
                          <!--[ Post body ]-->
                          <div class='postEntry' expr:id='&quot;postID-&quot; + data:post.id'>
                            <div class='postBody' id='postBody'>
                              <data:post.body/>                              
                            </div>
                          </div>
                        </b:if>

Trong thẻ <div class='postBody' id='postBody'> nó không có class post-body như trong javascript do vậy ta cần thêm class post-body thì quảng cáo mới hiện đúng vị trí ta chỉ định. Thêm vào nó sẽ như sau:

<b:if cond='data:view.isSingleItem'>
                          <!--[ Post body ]-->
                          <div class='postEntry' expr:id='&quot;postID-&quot; + data:post.id'>
                            <div class='post-body postBody' id='postBody'>
                              <data:post.body/>                              
                            </div>
                          </div>
                        </b:if>

Cài đặt nút chia sẻ Zalo mặc định và tùy chỉnh cho blogspot/website

noreply@blogger.com (Unknown) — Sat, 02 Dec 2023 13:11:00 +0000

Nếu như những nút chia sẻ của Facebook, Twitter... đã quá phổ biến và quen thuộc đối với blogspot/website thì nút chia sẻ của Zalo hiện nay cũng đã được nhiều blog sử dụng để bắt kịp và lợi dụng sự phát triển mạnh mẽ của ứng dụng Zalo trên internet.

Zalo là mạng xã hội của người Việt. Zalo được phát triển bởi VNG. Ngày nay Zalo được sử dụng khá phổ biến cho việc kinh doanh và phát triển thương hiệu.

Vậy tại sao chúng ta không tận dụng nó để tăng traffic cho blog/web vì tại phần ứng dụng của nó cũng cung cấp một số tiện ích có thể tích hợp vào blog ví dụ như nút chia sẻ, nút quan tâm, webchat và webcommentszalo...

Cài đặt nút chia sẻ zalo gồm 2 trường hợp:
- Hướng dẫn tạo nút chia sẻ zalo mặc định cho blogspot website.
- Hướng dẫn tạo nút chia sẻ zalo tùy chỉnh cho blogspot website.

Hướng dẫn tạo nút chia sẻ zalo mặc định cho blogspot website

Nếu bạn chưa có tài khoản Zalo thì hãy đăng ký cho mình một tài khoản trước khi thực hiện việc cài đặt này

Bước 1: Truy cập http://oa.zalo.me/ và đăng nhập vào tài khoản zalo của mình.

Bước 2: Hãy tạo cho mình một Official Account nếu bạn đã có thì bỏ qua bước này.

Chọn loại tài khoản phù hợp với blog của mình.
Sau khi tạo xong bạn sẽ có một giao diện như thế này

Bước 3: Bạn chọn mục Quản lý -> Thông tin tài khoản để lấy Official Account ID

Bạn cần ghi nhớ Official Acecount ID trong phần khoanh đỏ để dùng cho code sau này.

Bước 4: Tiếp theo bạn truy cập vào http://developers.zalo.me/docs/social/share
Trong này sẽ cho bạn tạo nút chia sẽ, nút theo dõi và widget cho Official Account của mình.
Ở đây mình sẽ chọn nút chia sẽ. Điền đầy đủ thông tin theo yêu cầu.

Sau khi lấy mã bạn sẽ được file javascript và đoạn mã HTML để cài vào blog.
+ Dán file js vào trước thẻ </body>

<script src="https://sp.zalo.me/plugins/sdk.js"></script>

Lưu ý:File js có thể dùng async='async'
Hoặc dùng javascript sau thay cho file js trên

<script>
 if (!window.disableZalo && window.innerWidth > 600) {
  (function(d, s, id){
   var js, fjs = d.getElementsByTagName(s)[0];
   if (d.getElementById(id)){ return; }
   js = d.createElement(s); js.id = id;js.async=true;
   js.onload = function(){
    // remote script has loaded
   };
   js.src = "//sp.zalo.me/plugins/sdk.js";
   fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'zalo-jssdk'));
 }
</script>

+ Dán đoạn html sau vào nơi cần hiển thị nút chia sẻ.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="zalo-share-button" expr:data-href="data:post.canonicalUrl" data-oaid="ID của Trang" data-layout="1" data-color="blue" data-customize="false"></div>
</b:if>

Thay ID của Trang thành Official Acecount ID ở bước 3.
Trong đó:
- data-layout: Nút chia sẻ bào gồm biểu tượng Zalo và nội dung "Chia sẻ"
Mặc định: nút chia sẻ chỉ chứa biểu tượng Zalo
- data-oaid: Zalo Official Account ID
- data-customize: true/false. Mặc định: false.
Nếu thiết lập true, layout mặc định của nút Chia sẻ sẽ không hiển thị,
nhà phát triển có thể tùy chỉnh nút Chia sẻ theo cách riêng của họ.
- data-href: URL muốn chia sẻ.
Ví dụ đoạn mã hoàn chỉnh có dạng:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="zalo-share-button" expr:data-href="data:post.canonicalUrl" data-oaid="579745863508352884" data-layout="1" data-color="blue" data-customize="false"></div>
</b:if>

Lưu ý: Phần data-layout có 4 kiểu nút tương ứng với 1, 2, 3, 4 để bạn lựa chọn do vậy bạn có thể tự thay đổi từ 1-4 theo ý thích.

Hướng dẫn tạo nút chia sẻ zalo tùy chỉnh cho blogspot website

Các bước cũng gần tương tụ như trường hợp cài đặt nút chia sẻ zalo mặc định chỉ khác đôi chút.
Bước 1:
Thêm CSS

.rrssb-zalo{cursor:pointer}
.rrssb-zalo a{background-color:#018fe5;padding:6px 10px 0 0;border-radius:3px}
.rrssb-zalo svg{height:18px;margin-top:6px;margin-left:10px}
.zshare-zalo{display:inline-block;cursor:pointer;border-radius:3px;height:20px;background:#008fe5;color:#fff;padding:0 5px}
.zshare-zalo:hover{background:#0c7abf}
.zshare-zalo svg{margin-top:1px}
.zshare-label{display:inline-block;font-weight:bold;font-size:13px;line-height:16px;height:20px;vertical-align:top;color:white;margin-left:3px;margin-top:6px}

Bước 2:
Thêm file js trước </body>

<script src="https://sp.zalo.me/plugins/sdk.js"></script>

Bước 3:
Thêm nút chia sẻ zalo vào vị trí bạn muốn

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="rrssb-zalo">
                      <a class="zalo-share-button" expr:data-href="data:post.canonicalUrl" data-oaid="Zalo Official Account ID của bạn" data-layout="icon-text" data-customize="true">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 150.3 149.9" enable-background="new 0 0 150.3 149.9" xml:space="preserve" style="height: 18px;">
<g id="Layer_1">
</g>
<g id="Layer_2">
<g>
<path fill="#FFFFFF" d="M128,70.3c-2.4,0-4.3,1-5.6,3c-1.2,1.8-1.8,3.9-1.8,6.4c0,2.6,0.6,4.8,1.7,6.5c1.3,2,3.2,3.1,5.7,3.1
c2.4,0,4.3-1,5.7-3.1c1.2-1.8,1.7-3.9,1.7-6.5c0-2.5-0.6-4.6-1.8-6.4C132.2,71.3,130.4,70.3,128,70.3z" />
<path fill="#FFFFFF" d="M65.3,70.7c-2.3,0-4.2,0.9-5.5,2.8c-1.2,1.7-1.8,3.7-1.8,6.2c0,2.5,0.6,4.6,1.7,6.3
c1.3,1.9,3.2,2.9,5.6,2.9c2.3,0,4.2-1,5.5-3c1.1-1.7,1.7-3.8,1.7-6.2c0-2.4-0.6-4.4-1.8-6.1C69.4,71.7,67.6,70.7,65.3,70.7z" />
<path fill="#FFFFFF" d="M75.1,0C33.6,0,0,32.3,0,72.2c0,20.9,9.3,39.8,24.1,52.9l-1.3,24.8l22.1-11.7c9.3,3.9,19.5,6.1,30.3,6.1
c41.5,0,75.1-32.3,75.1-72.2C150.3,32.3,116.6,0,75.1,0z M37.7,98.8H14.5c-5.4,0-8.1-1.9-8.1-5.8c0-1.8,1.1-4.2,3.2-7l20.7-27.4
H15.4c-5.5,0-8.2-1.7-8.2-5.2c0-3.5,2.7-5.3,8.2-5.3H35c6.6,0,9.9,1.9,9.9,5.6c0,1.7-1.1,4-3.4,7.1L21.3,88.1h16.3
c5.5,0,8.2,1.8,8.2,5.3C45.9,97,43.2,98.8,37.7,98.8z M83.8,91.1c0,5.5-1.8,8.2-5.5,8.2c-2.4,0-4.2-1.3-5.4-3.9
c-2.3,2.9-5.5,4.3-9.4,4.3c-5.2,0-9.4-2.1-12.6-6.2c-3-3.8-4.5-8.4-4.5-13.6c0-5.3,1.6-9.9,4.7-13.7c3.3-4.1,7.6-6.2,12.8-6.2
c3.8,0,6.8,1.3,9,4c1.3-2.4,3.1-3.6,5.4-3.6c3.7,0,5.5,2.7,5.5,8.1V91.1z M103.1,91.1c0,5.5-1.8,8.2-5.5,8.2
c-3.8,0-5.6-2.7-5.6-8.2V52.6c0-5.5,1.9-8.2,5.6-8.2c3.7,0,5.5,2.7,5.5,8.2V91.1z M128,99.9c-5.7,0-10.3-1.9-13.9-5.8
c-3.5-3.8-5.2-8.5-5.2-14.3c0-5.7,1.7-10.5,5.2-14.2c3.6-3.9,8.2-5.8,13.9-5.8c5.7,0,10.3,1.9,13.9,5.8c3.4,3.8,5.1,8.5,5.1,14.3
c0,5.8-1.7,10.5-5.1,14.3C138.3,98,133.7,99.9,128,99.9z" />
</g>
</g>
<g id="Layer_3">
</g>
</svg>
<span class="zshare-label" style="">Chia sẻ</span>
</a>
                       </div>
</b:if>

+ Với code trên bạn có thể tùy biến theo ý mình dựa vào css

<div class="rrssb-zalo">
<a class="zalo-share-button" expr:data-href="data:post.canonicalUrl" data-oaid="Zalo Official Account ID của bạn" data-layout="icon-text" data-customize="true">
Vị trí bạn tùy biến theo sở thích
<span class="zshare-label" style="">Chia sẻ</span>
</a>
                       </div>

Chúc thành công.