[Thủ thuật] Đóng dấu bản quyền watermark vào ảnh blogspot/forumotion

Bài viết này được tham khảo từ code watermark của baivong , Ưu điểm của code là có thể thêm chữ và ảnh logo chèn vào ảnh trong bài viết , đóng dấu bản quyền vào ảnh.

Nhược điểm là nó lại biến về base64 mà mình không thích lắm Sad

Mình sẽ hướng dẫn các bạn ở 2 mã nguồn là blogger và forumotion

[Thủ thuật] Đóng dấu bản quyền watermark vào ảnh blogspot/forumotion KgjH4sj

Thêm text và image watermark vào ảnh trong bài viết

Ở trường hợp của blogspot

Đầu tiên cho code js này vào <footer>

Code:

<script src="https://dl.dropboxusercontent.com/s/karip7yyl83aaek/jquery.watermark.min.js?dl=0"></script>
<script>// path to the watermark image
$(function(){
 //add text water mark; 
 $('.watermarktext img').watermark({
  text: 'hotrofm.net',
  textWidth: 100,
  textColor: 'white'
 });
 //add image water mark
 $('.watermarkimg img').watermark({
  path: 'https://dl.dropboxusercontent.com/s/nunjceykpqq1j1g/logo.png'
 }); 
})
</script>

Đầu tiên các bạn vào chỉnh sửa HTMl sau đó tìm

Code:

<data:post.body/>

Có thể trong có có nhiều <data:post.body/> thì bạn hay thử lần lượt nhé. Mình sẽ không nói chi tiết vì mỗi tem thiết kế một khác.

Nếu muốn đóng dấu chữ thì đổi thành

Code:

<div class="watermarktext"> <data:post.body/> </div>

Nếu muốn đóng dấu là ảnh thì đổi thành

Code:

<div class="watermarkimg"> <data:post.body/> </div>

Ở trường hợp của forumotion

Copy code sau vào vewtopic body

Code:


<script>
$(function(){
 $('.watermarktext img').watermark({
  text: 'hotrofm.net',
  textWidth: 100,
  textColor: 'white'
 });
 $('.watermarkimg img').watermark({
  path: 'https://dl.dropboxusercontent.com/s/nunjceykpqq1j1g/logo.png'
 }); 
})
</script>

tìm dòng

Code:

{postrow.displayed.MESSAGE}

Nếu muốn đóng dấu chữ thì đổi thành

Code:

<div class="watermarktext"> {postrow.displayed.MESSAGE}  </div>

Nếu muốn đóng dấu là ảnh thì đổi thành

Code:

<div class="watermarkimg"> {postrow.displayed.MESSAGE}  </div>

P/S : Ai chưa có thư viện jquery thi cho vào nhé (tốt nhất cứ cho vào vì mình test trên 2.1.4 mới thấy dùng được chưa test các thư viện khác

Code:

<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>