Tạo chức năng upload ảnh nhanh
1. Tác dụng:
- Upload hình ảnh lên hosting Google Picasa & xuất link nhúng.
- Upload hình ảnh mà không cần load trang hiện tại.
2. Phương thức hoạt động:
- Sử dụng jquery của fancybox để load iframe trang upload hình ảnh. Do vậy, trước tiên chúng ta cần phải có 1 trang upload ảnh đã.
3. Hướng dẫn:
a. Hướng dẫn tạo trang upload ảnh lên Google Picasa's hosting: ;
- Download file Upanh ở đính kèm về và giải nén ta có 2 thư mục: "fancybox" và "upanh"
- Upload 2 forder đó lên hosting (ngang hàng file index.php của forum)
- Thay file logo.png trong thư mục "upanh" bằng file logo.png của bạn. (Đây là file dùng để đóng dấu ảnh sau khi file ảnh đã được upload trên Google Picasa.)
- Sửa lại thông số của file "config.php" trong thư mục "upanh":
- Vào trang http://picasaweb.google.com/home để tạo album ảnh - Nên lập riêng 1 tài khoản Gmail miễn phí để dùng cho upanh)
Lưu ý:
1. Hướng dẫn lấy dãy số ID của Album: Xem hình các bước dưới đây nhá! ><
- Bước 1:
- Bước 2:
Click vào nút "Thêm ảnh"
Bấm đúp vào dãy số ID để copy và dán vào file "config.php"
1 tài khoản Google hiện tại cho 1Gb để upload ảnh vào Picasa Web (ảnh có size nhỏ hơn 800px ko bị tính vào dung lượng), giới hạn 1000 ảnh trong 1 album.
b. Hướng dẫn nhúng trang upanh:
- Vào sửa temp PAGE_CONTAINER, tìm đoạn:
- Chèn xuống dưới đoạn code sau:
- Chèn xuống dưới đoạn code sau:
* Thêm nút "Upload Ảnh vào thanh menu:
- Vào sửa temp navigation, tìm đoạn:
- Chèn lên trên:
Vậy là xong, khi ra ngoài, trên thanh Menu, sẽ có thêm nút Upload ảnh.
Trong trường hợp các bạn muốn chỉ cho thành viên đã đăng nhập mới được upload ảnh thì thay bằng đoạn code sau:
* Thêm nút "Upload Ảnh vào khung soạn thảo:
- Vào template: thread_create tìm đoạn sau:
- Thay bằng đoạn code sau:
Lưu ý: Bạn phải sửa "http://yourdomain/upanh" thành đường dẫn đến trang upload ảnh của bạn.:>
Chúc bạn thành công!
1. Tác dụng:
- Upload hình ảnh lên hosting Google Picasa & xuất link nhúng.
- Upload hình ảnh mà không cần load trang hiện tại.
2. Phương thức hoạt động:
- Sử dụng jquery của fancybox để load iframe trang upload hình ảnh. Do vậy, trước tiên chúng ta cần phải có 1 trang upload ảnh đã.
3. Hướng dẫn:
a. Hướng dẫn tạo trang upload ảnh lên Google Picasa's hosting: ;
- Download file Upanh ở đính kèm về và giải nén ta có 2 thư mục: "fancybox" và "upanh"
- Upload 2 forder đó lên hosting (ngang hàng file index.php của forum)
- Thay file logo.png trong thư mục "upanh" bằng file logo.png của bạn. (Đây là file dùng để đóng dấu ảnh sau khi file ảnh đã được upload trên Google Picasa.)
- Sửa lại thông số của file "config.php" trong thư mục "upanh":
Mã:
<?php
set_time_limit(0);
define('DIR', dirname(__FILE__));
$user = "Dia-chi-Gmail";
$pass = "Mat-khau-dang-nhap-Gmail";
$albumId = "ID-album_tren_https://picasaweb.google.com";
$sitename = 'vnxf.vn';
$images_in_slide = 10;
$max_images_size = 2; //2 = 2MB
?>- Vào trang http://picasaweb.google.com/home để tạo album ảnh - Nên lập riêng 1 tài khoản Gmail miễn phí để dùng cho upanh)
Lưu ý:
1. Hướng dẫn lấy dãy số ID của Album: Xem hình các bước dưới đây nhá! >
<- Bước 1:
Click vào nút "Thêm ảnh"
b. Hướng dẫn nhúng trang upanh:
- Vào sửa temp PAGE_CONTAINER, tìm đoạn:
Mã:
</xen:hook>
</head>- Chèn xuống dưới đoạn code sau:
Mã:
</xen:hook>
</head>
Mã:
<script type="text/javascript" src="fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<script type="text/javascript" src="fancybox/khac.js"></script>* Thêm nút "Upload Ảnh vào thanh menu:
- Vào sửa temp navigation, tìm đoạn:
Mã:
<!-- extra tabs: end -->- Chèn lên trên:
Mã:
<!-- upanh -->
<li class="navTab members Popup PopupControl PopupClosed PopupContainerControl">
<a id="kenhkinhdoanh-iframe" class="navLink" href="http://yourdomain/upanh">Upload Ảnh</a>
</li>Vậy là xong, khi ra ngoài, trên thanh Menu, sẽ có thêm nút Upload ảnh.
Trong trường hợp các bạn muốn chỉ cho thành viên đã đăng nhập mới được upload ảnh thì thay bằng đoạn code sau:
Mã:
<!-- upanh -->
<xen:if is="{$visitor.user_id}">
<li class="navTab members Popup PopupControl PopupClosed PopupContainerControl">
<a id="kenhkinhdoanh-iframe" class="navLink" href="http://yourdomain/upanh">Upload Ảnh</a>
</li>
</xen:if>* Thêm nút "Upload Ảnh vào khung soạn thảo:
- Vào template: thread_create tìm đoạn sau:
Mã:
<dl class="ctrlUnit submitUnit">
<dt></dt>
<dd>
<input type="submit" value="{xen:phrase create_thread}" accesskey="s" class="button primary" />
<xen:include template="attachment_upload_button" />
<input type="button" value="{xen:phrase preview}..." class="button PreviewButton JsOnly" />
</dd>
</dl>- Thay bằng đoạn code sau:
Mã:
<dl class="ctrlUnit submitUnit">
<dt></dt>
<dd>
<input type="submit" value="{xen:phrase create_thread}" accesskey="s" class="button primary" />
<xen:include template="attachment_upload_button" />
<li class="navTab members Popup PopupControl PopupClosed PopupContainerControl">
<a id="kenhkinhdoanh-iframe" class="button primary" href="http://yourdomain/upanh">Upload Ảnh</a>
</li>
<input type="button" value="{xen:phrase preview}..." class="button PreviewButton JsOnly" />
</dd>
</dl>Lưu ý: Bạn phải sửa "http://yourdomain/upanh" thành đường dẫn đến trang upload ảnh của bạn.:>
Chúc bạn thành công!
Nguồn: bangvu.net
