Hướng dẫn Tạo chức năng upload ảnh nhanh

nghia12345

Thượng Đế
Tham gia
28/02/2016
Bài viết
96
Được Like
17
sao mình làm đúng hưởng dẫn hết rồi mà up nó cứ thế này mai ko úp được hjxhjx
Untitled47f7b.png
 

nghia12345

Thượng Đế
Tham gia
28/02/2016
Bài viết
96
Được Like
17
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":

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á! >:D<
- 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:
Mã:
</xen:hook>
</head>

- Chèn xuống dưới đoạn code sau:
Mã:
</xen:hook>
</head>
- Chèn xuống dưới đoạn code sau:
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​
sao mình đúng hướng dẫn mà up no lod haoì ko hiện ra ảnh nhỉ mong bác hướng dẫn giúp ạ
 

longruoi

Thượng Đế
Thành viên BQT
Tham gia
19/04/2015
Bài viết
263
Được Like
216
sao mình đúng hướng dẫn mà up no lod haoì ko hiện ra ảnh nhỉ mong bác hướng dẫn giúp ạ
Vấn đề là trang up ảnh hoạt động độc lập của bác đã sử dụng được chưa? Nó hoạt động được rồi thì hãy nghĩ tới việc chèn code như hướng dẫn.
 

nghia12345

Thượng Đế
Tham gia
28/02/2016
Bài viết
96
Được Like
17
Vấn đề là trang up ảnh hoạt động độc lập của bác đã sử dụng được chưa? Nó hoạt động được rồi thì hãy nghĩ tới việc chèn code như hướng dẫn.
minh ko hiểu lấm bạn có thể hướng dẫn chi tiết hộ mình được ko ạ
 

longruoi

Thượng Đế
Thành viên BQT
Tham gia
19/04/2015
Bài viết
263
Được Like
216
minh ko hiểu lấm bạn có thể hướng dẫn chi tiết hộ mình được ko ạ
Ví dụ bác đã có một trang upload ảnh như http://photo.vtplus.xyz và đã up ảnh bình thường, thì khi đó bác mới tạo cái popup upload được. Popup chỉ là phần hiển thị, còn trang upload mới là cái nhân.
 
  • Like
Reactions: PVS

nghia12345

Thượng Đế
Tham gia
28/02/2016
Bài viết
96
Được Like
17
Ví dụ bác đã có một trang upload ảnh như http://photo.vtplus.xyz và đã up ảnh bình thường, thì khi đó bác mới tạo cái popup upload được. Popup chỉ là phần hiển thị, còn trang upload mới là cái nhân.
mình củng xái pcasa google giống chủ thớt hướng dẫn và vẫn úp bình thường mà
 

longruoi

Thượng Đế
Thành viên BQT
Tham gia
19/04/2015
Bài viết
263
Được Like
216
Bác đưa địa chỉ trang upload của bác mình test thử xem.
 

nghia12345

Thượng Đế
Tham gia
28/02/2016
Bài viết
96
Được Like
17
Cái này là bác up trực tiếp trên site của picasa rồi, bác phải tạo một trang up load của riêng bác ( trang trung gian do bác quản lý). Vì hướng dẫn bài này là gọi trang trung gian lên popup mà.
cách tạo sao vậy bạn hướng dẫn mình với được ko ?
 

longruoi

Thượng Đế
Thành viên BQT
Tham gia
19/04/2015
Bài viết
263
Được Like
216
Vậy domain up ảnh của bác là gì? Chạy được chưa?
 

nghia12345

Thượng Đế
Tham gia
28/02/2016
Bài viết
96
Được Like
17
Vậy domain up ảnh của bác là gì? Chạy được chưa?
mình ko hiểu cái bước này lắm cái này để làm gì vậy bạn ?
mình chỉ còn vướng bước này còn lại ok hết roi
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 đã. ;)
 

longruoi

Thượng Đế
Thành viên BQT
Tham gia
19/04/2015
Bài viết
263
Được Like
216
mình ko hiểu cái bước này lắm cái này để làm gì vậy bạn ?
mình chỉ còn vướng bước này còn lại ok hết roi
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 đã. ;)
Khi bạn giải nén file đính kèm ra thì sẽ có 2 thư mục,upa cả 2 lên host của bạn. trong đó 1 là upanh bạn cần cấu hình file config.php trong đó theo hướng dẫn ở trang 1. Khi hoàn thành thì domain up ảnh của bạn sẽ là http://domaincuaban/upanh
Bạn vào domain đó up ảnh xem hoạt động chưa. Nếu chưa thì cần xem xét lại cấu hình. Còn hoạt động ok thì tất nhiên phần popup kia của bạn cũng hoạt động tốt.
 

nghia12345

Thượng Đế
Tham gia
28/02/2016
Bài viết
96
Được Like
17
Khi bạn giải nén file đính kèm ra thì sẽ có 2 thư mục,upa cả 2 lên host của bạn. trong đó 1 là upanh bạn cần cấu hình file config.php trong đó theo hướng dẫn ở trang 1. Khi hoàn thành thì domain up ảnh của bạn sẽ là http://domaincuaban/upanh
Bạn vào domain đó up ảnh xem hoạt động chưa. Nếu chưa thì cần xem xét lại cấu hình. Còn hoạt động ok thì tất nhiên phần popup kia của bạn cũng hoạt động tốt.
à mjnh hiểu rồi đây bạn
http://vipboyvn.net/upanh
 

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Hỗ trợ trực tuyến

Support Quảng cáo
Mr. San (PVS)

Skype chat, instant message

Mr. Tuấn (Blue)

Skype chat, instant message

Mr. Tuấn
0988 488 096
Mr. Trọng
0906 081 284
kinhdoanh@vnxf.vn


Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Điện Lạnh Thịnh Phát
Top Bottom