CINXE.COM

Upload plugin - HotIMG.com

<!DOCTYPE HTML> <html xml:lang="en" lang="en" dir="ltr" class="device-nonmobile palette-blanco unsafe-blur-on recaptcha recaptcha--3" data-palette="blanco" prefix="og: http://ogp.me/ns#"> <head> <meta charset="utf-8"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content="Free image hosting and sharing service, upload images, pictures, photo host. Join now for reliable &amp; user-friendly free image hosting."> <title>Upload plugin - HotIMG.com</title> <meta name="generator" content="Chevereto 4"> <link rel="stylesheet" href="/content/legacy/themes/Peafowl/lib/peafowl.min.css?76e991ef18f00ccead0908dad1e8ca36"> <link rel="stylesheet" href="/content/legacy/themes/Peafowl/style.min.css?76e991ef18f00ccead0908dad1e8ca36"> <link rel="stylesheet" href="/content/legacy/themes/Peafowl/lib/font-awesome-6/css/all.min.css?76e991ef18f00ccead0908dad1e8ca36"> <script data-cfasync="false">document.documentElement.className+=" js";var devices=["phone","phablet","tablet","laptop","desktop","largescreen"],window_to_device=function(){for(var e=[480,768,992,1200,1880,2180],t=[],n="",d=document.documentElement.clientWidth||document.getElementsByTagName("body")[0].clientWidth||window.innerWidth,c=0;c<devices.length;++c)d>=e[c]&&t.push(devices[c]);for(0==t.length&&t.push(devices[0]),n=t[t.length-1],c=0;c<devices.length;++c)document.documentElement.className=document.documentElement.className.replace(devices[c],""),c==devices.length-1&&(document.documentElement.className+=" "+n),document.documentElement.className=document.documentElement.className.replace(/\s+/g," ");if("laptop"==n||"desktop"==n){var o=document.getElementById("pop-box-mask");null!==o&&o.parentNode.removeChild(o)}};window_to_device(),window.onresize=window_to_device;function jQueryLoaded(){!function(n,d){n.each(readyQ,function(d,e){n(e)}),n.each(bindReadyQ,function(e,i){n(d).bind("ready",i)})}(jQuery,document)}!function(n,d,e){function i(d,e){"ready"==d?n.bindReadyQ.push(e):n.readyQ.push(d)}n.readyQ=[],n.bindReadyQ=[];var u={ready:i,bind:i};n.$=n.jQuery=function(n){return n===d||void 0===n?u:void i(n)}}(window,document); </script> <link rel="shortcut icon" href="https://hotimg.com/content/images/system/favicon_1707905222300_547183.png"> <link rel="icon" type="image/png" href="https://hotimg.com/content/images/system/favicon_1707905222300_547183.png" sizes="192x192"> <link rel="apple-touch-icon" href="https://hotimg.com/content/images/system/favicon_1707905222300_547183.png" sizes="180x180"> <meta property="og:type" content="website" /> <meta property="og:url" content="/plugin" /> <meta property="og:title" content="Upload Image -- Free Image Hosting" /> <meta property="og:image" content="/content/images/system/default/home_cover.jpg" /> <meta property="og:site_name" content="HotIMG.com" /> <meta property="og:description" content="Free image hosting and sharing service, upload images, pictures, photo host. Join now for reliable &amp; user-friendly free image hosting." /> <meta name="twitter:card" content="summary"> <meta name="twitter:description" content="Free image hosting and sharing service, upload images, pictures, photo host. Join now for reliable &amp; user-friendly free image hosting."> <meta name="twitter:title" content="Upload plugin"> <meta name="twitter:site" content="@hotimgcom"> <style> html, body { margin: 0; padding: 0; height: 100%; } .content { min-height: calc(100% - 60px); /* Adjust 60px to the height of your footer */ /* Your content styling */ } .sticky-footer { position: fixed; left: 0; bottom: 0; width: 100%; background-color: #ffffff; /* Light grey background */ text-align: center; height: 60px; /* Set the height of your footer */ line-height: 60px; /* Center the content vertically */ border: none; /* Remove borders */ } .sticky-footer table { width: 100%; height: 100%; border-collapse: collapse; /* Removes any space between borders */ border: none; /* Removes table borders */ background-color: white; /* Sets the table background color to white */ } .sticky-footer td, .sticky-footer th { border: none; /* Remove cell borders */ padding: 0; /* Adjust padding as needed */ } .sticky-footer a { color: black; /* Sets the text color to black */ text-decoration: none; /* Optional: removes the underline from links. Remove this line if you prefer the underline for clarity */ } /* Ensure links within the footer have a black color even after being visited */ .sticky-footer a:visited { color: black; } </style> <script> </script><script async data-id="101450808" src="//static.getclicky.com/js"></script><script> </script> <style> .palette-dark:root{ --alertAccent: hsl(48, 89%, 50%); --alertBackground: hsl(52, 100%, 90%); --alertText: hsl(278, 22%, 10%); --bodyBackground: hsl(245, 9%, 18%); --bodyEmpty: hsl(245, 10%, 22%); --bodySeparator: var(--bodyEmpty); --bodyText: hsl(245, 5%, 80%); --bodyTextSubtle: hsl(245, 5%, 45%); --buttonDefaultBackground: var(--bodyEmpty); --buttonDefaultHoverBackground: hsl(245, 5%, 10%); --buttonDefaultHoverText: var(--colorAccent); --buttonDefaultText: var(--bodyText); --inputBackground: hsl(245, 10%, 10%); --inputPlaceholderText: hsl(245, 5%, 50%); --inputText: var(--bodyText); --menuBackground: hsla(245, 10%, 8%, 80%); --menuItemHoverBackground: var(--colorAccent); --menuItemHoverText: hsl(245, 5%, 100%); --menuItemText: var(--bodyText); --menuSeparator: var(--bodyBackground); --menuText: var(--bodyText); --modalBackground: var(--bodyBackground); --modalText: var(--bodyText); --topBarBackground: hsl(245, 9%, 18%); --topBarText: var(--bodyText); --viewerBackground: hsl(245, 5%, 12%); } .palette-lush:root{ --alertAccent: hsl(48, 89%, 50%); --alertBackground: hsl(52, 100%, 90%); --alertText: hsl(278, 22%, 10%); --bodyBackground: hsl(150, 25%, 94%); --bodyEmpty: hsl(150, 25%, 85%); --bodySeparator: var(--bodyEmpty); --bodyText: hsl(150, 25%, 16%); --bodyTextDisabled: hsl(150, 25%, 50%); --bodyTextSubtle: hsl(189, 6%, 45%); --buttonAccentBackground: hsl(150, 25%, 70%); --buttonAccentHoverBackground: hsl(150, 25%, 60%); --buttonAccentHoverText: var(--buttonAccentText); --buttonAccentText: hsl(150, 25%, 20%); --buttonDefaultBackground: var(--bodyBackground); --buttonDefaultBorder: hsl(150, 25%, 80%); --buttonDefaultHoverBackground: hsl(150, 25%, 85%); --buttonDefaultHoverBorder: hsl(150, 25%, 80%); --buttonDefaultHoverText: hsl(150, 25%, 20%); --buttonDefaultText: hsl(150, 25%, 20%); --colorAccent: hsl(150, 40%, 50%); --colorAccentStrong: hsl(150, 25%, 40%); --inputBackground: hsl(0, 0%, 100%); --inputPlaceholderText: hsl(150, 25%, 40%, 0.2); --inputText: var(--bodyText); --linkText: var(--colorAccent); --menuBackground: hsla(150, 25%, 90%, 80%); --menuItemHoverBackground: var(--colorAccent); --menuItemHoverText: #FFF; --menuItemText: var(--bodyText); --menuSeparator: hsl(150, 25%, 72%); --menuText: var(--bodyText); --modalBackground: var(--bodyBackground); --modalText: var(--bodyText); --topBarBackground: var(--bodyBackground); --topBarText: var(--bodyText); --listItemText: var(--bodyBackground); } .palette-graffiti:root { --alertAccent: hsl(48, 89%, 50%); --alertBackground: hsl(52, 100%, 90%); --alertText: var(--bodyText); --bodyBackground: hsl(279, 77%, 95%); --bodyEmpty: hsl(278, 80%, 91%); --bodySeparator: hsl(278, 80%, 94%); --bodyText: hsl(278, 22%, 10%); --bodyTextDisabled: hsl(278, 80%, 90%); --buttonAccentBackground: var(--colorAccent); --buttonAccentHoverBackground: var(--colorAccentStrong); --buttonAccentHoverText: var(--buttonAccentText); --buttonDefaultBackground: var(--bodyBackground); --buttonDefaultBorder: hsl(278, 80%, 90%); --buttonDefaultHoverBackground: var(--bodyEmpty); --buttonDefaultHoverBorder: hsl(278, 80%, 90%); --buttonDefaultHoverText: var(--colorAccentStrong); --buttonDefaultText: var(--colorAccent); --colorAccent: hsl(278, 33%, 44%); --colorAccentStrong: hsl(278, 33%, 40%); --inputBackground: hsl(0, 0%, 100%); --inputText: hsl(278, 22%, 10%); --linkText: var(--colorAccent); --menuBackground: hsla(278, 80%, 90%, 80%); --menuItemHoverBackground: var(--colorAccent); --menuItemHoverText: #FFF; --menuItemText: var(--inputText); --menuSeparator: hsl(278, 80%, 79%); --menuText: var(--inputText); --modalBackground: var(--bodyBackground); --modalText: var(--inputText); --topBarBackground: var(--bodyBackground); --topBarText: var(--bodyText); --listItemText: var(--bodyBackground); } .palette-abstract:root{ --alertAccent: hsl(48, 89%, 50%); --alertBackground: hsl(52, 100%, 90%); --alertText: hsl(278, 22%, 10%); --bodyBackground: hsl(15, 73%, 97%); --bodyEmpty: hsl(15, 100%, 92%); --bodySeparator: var(--bodyEmpty); --bodyText: hsl(15, 25%, 16%); --bodyTextDisabled: hsl(15, 100%, 90%); --bodyTextSubtle: hsl(189, 6%, 45%); --buttonAccentBackground: var(--colorAccent); --buttonAccentHoverBackground: var(--colorAccentStrong); --buttonAccentHoverText: var(--buttonAccentText); --buttonAccentText: hsl(0, 0%, 100%); --buttonDefaultBackground: var(--bodyBackground); --buttonDefaultBorder: hsl(15, 70%, 90%); --buttonDefaultHoverBackground: hsl(15, 100%, 95%); --buttonDefaultHoverBorder: hsl(15, 80%, 90%); --buttonDefaultHoverText: var(--colorAccentStrong); --buttonDefaultText: var(--colorAccentStrong); --colorAccent: hsl(15, 70%, 30%); --colorAccentStrong: hsl(15, 70%, 40%); --inputBackground: var(--buttonAccentText); --inputPlaceholderText: hsl(15, 100%, 20%, 0.3); --inputText: var(--bodyText); --linkText: var(--colorAccent); --menuBackground: hsla(15, 100%, 90%, 80%); --menuItemHoverBackground: var(--colorAccent); --menuItemHoverText: #FFF; --menuItemText: var(--bodyText); --menuSeparator: hsl(15, 71%, 74%); --menuText: var(--bodyText); --modalBackground: var(--bodyBackground); --modalText: var(--bodyText); --topBarBackground: var(--bodyBackground); --topBarText: var(--bodyText); --listItemText: var(--bodyBackground); } .palette-cheers:root{ --alertAccent: hsl(48, 89%, 50%); --alertBackground: hsl(52, 100%, 90%); --alertText: hsl(278, 22%, 10%); --bodyBackground: hsl(42, 60%, 91%); --bodyEmpty: hsl(42, 80%, 82%); --bodySeparator: var(--bodyEmpty); --bodyText: hsl(42, 25%, 16%); --bodyTextDisabled: hsl(42, 100%, 50%); --bodyTextSubtle: hsl(189, 6%, 45%); --buttonAccentBackground: hsl(42, 100%, 70%); --buttonAccentHoverBackground: hsl(42, 100%, 60%); --buttonAccentHoverText: var(--buttonAccentText); --buttonAccentText: hsl(42, 80%, 20%); --buttonDefaultBackground: var(--bodyBackground); --buttonDefaultBorder: hsl(42, 70%, 80%); --buttonDefaultHoverBackground: hsl(42, 80%, 85%); --buttonDefaultHoverBorder: hsl(42, 80%, 80%); --buttonDefaultHoverText: hsl(42, 80%, 20%); --buttonDefaultText: hsl(42, 80%, 20%); --colorAccent: hsl(42, 100%, 50%); --colorAccentStrong: hsl(42, 100%, 40%); --inputBackground: hsl(0, 0%, 100%); --inputPlaceholderText: hsl(42, 100%, 40%, 0.2); --inputText: var(--bodyText); --linkText: var(--colorAccent); --menuBackground: hsla(42, 90%, 90%, 80%); --menuItemHoverBackground: var(--colorAccent); --menuItemHoverText: #FFF; --menuItemText: var(--bodyText); --menuSeparator: hsl(42, 70%, 67%); --menuText: var(--bodyText); --modalBackground: var(--bodyBackground); --modalText: var(--bodyText); --topBarBackground: var(--bodyBackground); /* hsl(42, 100%, 70%) */ --topBarText: var(--bodyText); --listItemText: var(--bodyBackground); } .palette-imgur:root { --alertAccent: var(--colorAccent); --alertBackground: #463979; --alertText: var(--bodyText); --backgroundDarkAlpha: rgb(0 0 0 / 80%); --backgroundLightAlpha: rgba(26, 25, 62, .9); --bodyBackground: rgb(39,41,45); --bodyEmpty: var(--buttonDefaultBackground); --bodySeparator: #585D6A; --bodyText: #DADCDF; --bodyTextDisabled: #b4b9c2; --bodyTextSubtle: #999; --buttonAccentHoverText: var(--buttonAccentText); --buttonAccentText: #FFF; --buttonDefaultBackground: #464b57; --buttonDefaultHoverBackground: var(--colorAccent); --buttonDefaultHoverText: var(--buttonAccentText); --buttonDefaultText: #b4b9c2; --colorAccent: #1bb76e; --colorAccentStrong: #31be7c; --inputBackground: #191919; --inputPlaceholderText: #9298a0; --inputText: #f2f2f2; --linkText: var(--colorAccent); --menuBackground: hsl(222deg 6% 35% / 80%); --menuItemHoverBackground: hsla(0,0%,80%,.29); --menuItemHoverText: var(--buttonAccentText); --menuItemText: var(--buttonAccentText); --menuSeparator: rgb(11 14 15 / 10%); --menuText: var(--buttonAccentText); --modalBackground: rgb(60 66 75 / 50%); --modalText: var(--buttonAccentText); --topBarBackground: linear-gradient(180deg, #171544 0%, rgba(39,41,45,1)); --topBarText: var(--bodyText); --viewerBackground: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.1)); } .palette-flickr:root { --bodyBackground: #f2f5f6; --colorAccent: #128fdc; --colorAccentStrong: #1c9be9; --linkText: #006dac; --topBarBackground: rgb(0 0 0 / 90%); --topBarText: #FFF; --viewerBackground: #212124; } .palette-deviantart:root { --alertAccent: var(--colorAccent); --alertBackground: #9affde; --bodyBackground: #06070d; --bodyEmpty: var(--bodyBackground); --bodyText: #f2f2f2; --bodyTextSubtle: #5d5c6c; --buttonAccentHoverBackground: var(--colorAccentStrong); --buttonAccentHoverText: var(--buttonAccentText); --buttonAccentText: #FFF; --buttonDefaultBackground: var(--bodyBackground); --buttonDefaultHoverBackground:var(--bodyBackground); --buttonDefaultHoverText: var(--buttonDefaultText); --buttonDefaultText: #f2f2f2; --colorAccent: #00e59b; --colorAccentStrong: #31be7c; --inputBackground: #292f34; --inputPlaceholderText: #838592; --inputText: #838592; --linkText: var(--colorAccent); --menuBackground: var(--bodyBackground); --menuItemHoverBackground: #282f34; --menuItemHoverText: var(--colorAccent); --menuItemText: #b1b1b9; --menuText: var(--buttonAccentText); --modalText: var(--buttonDefaultText); --topBarBackground: #06070d; --topBarText: #fff; --viewerBackground: linear-gradient(180deg, rgba(26,28,35,1) 0%, rgba(11,13,18,1) 100%); } .palette-cmyk:root { --alertAccent: var(--buttonAccentBackground); --alertBackground: #fff5b3; --alertText: var(--bodyText); --bodyBackground: #000; --bodyEmpty: #000e10; --bodySeparator: #370f1d; --bodyText: #00bcd4; --bodyTextSubtle: var(--buttonAccentBackground); --buttonAccentBackground: #ec407a; --buttonAccentHoverBackground: var(--bodyText); --buttonAccentHoverText: #fff; --buttonAccentText: var(--buttonAccentHoverText); --buttonDefaultBackground: var(--bodyBackground); --buttonDefaultHoverBackground: var(--bodyBackground); --buttonDefaultHoverText: #ffd54f; --buttonDefaultText: var(--buttonAccentBackground); --colorAccent: var( --buttonDefaultHoverText); --inputBackground: #edcf6e; --inputPlaceholderText: var(--bodyBackground); --linkText: var(--buttonDefaultHoverText); --menuBackground: rgb(0 0 0 / 70%); --menuItemHoverBackground: var(--buttonAccentBackground); --menuItemHoverText: var(--buttonAccentText); --menuItemText: var(--buttonDefaultHoverText); --menuSeparator: rgb(11 14 15 / 10%); --menuText: var(--buttonAccentHoverText); --modalBackground: var(--bodyBackground); --modalText: var(--bodyText); --topBarBackground: rgb(0 0 0 / 70%); --topBarText: var(--bodyText); --viewerBackground: linear-gradient(180deg, rgba(26,28,35,1) 0%, rgba(11,13,18,1) 100%); } </style> <link rel="alternate" hreflang="x-default" href="/plugin"> <link rel="alternate" hreflang="ar" href="/plugin/?lang=ar"> <link rel="alternate" hreflang="bg-bg" href="/plugin/?lang=bg-BG"> <link rel="alternate" hreflang="bs-ba" href="/plugin/?lang=bs-BA"> <link rel="alternate" hreflang="ca" href="/plugin/?lang=ca"> <link rel="alternate" hreflang="cs" href="/plugin/?lang=cs"> <link rel="alternate" hreflang="da" href="/plugin/?lang=da"> <link rel="alternate" hreflang="de" href="/plugin/?lang=de"> <link rel="alternate" hreflang="de-de" href="/plugin/?lang=de-DE"> <link rel="alternate" hreflang="el" href="/plugin/?lang=el"> <link rel="alternate" hreflang="en" href="/plugin/?lang=en"> <link rel="alternate" hreflang="es" href="/plugin/?lang=es"> <link rel="alternate" hreflang="et-ee" href="/plugin/?lang=et-EE"> <link rel="alternate" hreflang="fa" href="/plugin/?lang=fa"> <link rel="alternate" hreflang="fi" href="/plugin/?lang=fi"> <link rel="alternate" hreflang="fr" href="/plugin/?lang=fr"> <link rel="alternate" hreflang="he" href="/plugin/?lang=he"> <link rel="alternate" hreflang="hr" href="/plugin/?lang=hr"> <link rel="alternate" hreflang="hu" href="/plugin/?lang=hu"> <link rel="alternate" hreflang="id" href="/plugin/?lang=id"> <link rel="alternate" hreflang="it" href="/plugin/?lang=it"> <link rel="alternate" hreflang="ja" href="/plugin/?lang=ja"> <link rel="alternate" hreflang="ko" href="/plugin/?lang=ko"> <link rel="alternate" hreflang="lt-lt" href="/plugin/?lang=lt-LT"> <link rel="alternate" hreflang="nb" href="/plugin/?lang=nb"> <link rel="alternate" hreflang="nl" href="/plugin/?lang=nl"> <link rel="alternate" hreflang="pl" href="/plugin/?lang=pl"> <link rel="alternate" hreflang="pt" href="/plugin/?lang=pt"> <link rel="alternate" hreflang="pt-br" href="/plugin/?lang=pt-BR"> <link rel="alternate" hreflang="ro" href="/plugin/?lang=ro"> <link rel="alternate" hreflang="ru" href="/plugin/?lang=ru"> <link rel="alternate" hreflang="sk" href="/plugin/?lang=sk"> <link rel="alternate" hreflang="sr-rs" href="/plugin/?lang=sr-RS"> <link rel="alternate" hreflang="sv" href="/plugin/?lang=sv"> <link rel="alternate" hreflang="th" href="/plugin/?lang=th"> <link rel="alternate" hreflang="tr" href="/plugin/?lang=tr"> <link rel="alternate" hreflang="uk" href="/plugin/?lang=uk"> <link rel="alternate" hreflang="vi" href="/plugin/?lang=vi"> <link rel="alternate" hreflang="zh-cn" href="/plugin/?lang=zh-CN"> <link rel="alternate" hreflang="zh-tw" href="/plugin/?lang=zh-TW"> </head> <body id="plugin" class="page"> <header id="top-bar" class="top-bar top-bar--main"> <div class="content-width"> <div id="logo" class="top-bar-logo"> <a href="/"><img src="https://hotimg.com/content/images/system/logo_1707905093356_1a6204.png" alt="HotIMG.com"></a> </div> <ul class="top-bar-left float-left"> <li data-action="top-bar-menu-full" data-nav="mobile-menu" class="top-btn-el phone-show hidden"> <span class="top-btn-text"><span class="icon fas fa-bars"></span></span> </li> <li id="top-bar-explore" data-nav="explore" class="phone-hide pop-keep-click pop-btn pop-btn-show"> <span class="top-btn-text"><span class="icon fas fa-compass"></span><span class="btn-text phone-hide phablet-hide">Explore</span></span> <div class="pop-box arrow-box arrow-box-top anchor-left"> <div class="pop-box-inner pop-box-menu"> <div class="pop-box-label"><i class="fas fa-drafting-compass"></i> Discovery</div> <ul> <li><a href="/explore/recent"><span class="btn-icon fas fa-history"></span><span class="btn-text">Recent</span></a></li><li><a href="/explore/trending"><span class="btn-icon fas fa-poll"></span><span class="btn-text">Trending</span></a></li><li><a href="/explore/popular"><span class="btn-icon fas fa-heart"></span><span class="btn-text">Popular</span></a></li><li><a href="/explore/animated"><span class="btn-icon fas fa-play"></span><span class="btn-text">Animated</span></a></li> </ul> </div> </div> </li> </ul> <ul class="top-bar-right float-right keep-visible"> <li data-action="top-bar-upload" data-link="js" data-nav="upload" class="top-btn-el" > <a href="/upload" class="top-btn-text"><span class="icon fas fa-cloud-upload-alt"></span><span class="btn-text phone-hide phablet-hide">Upload</span></a> </li> <li id="top-bar-signin" data-nav="signin" class="top-btn-el"> <a href="/login" class="top-btn-text"><span class="icon fas fa-sign-in-alt"></span><span class="btn-text phone-hide phablet-hide">Sign in</span> </a> </li> <li data-nav="language" class="phone-hide pop-btn"> <span class="top-btn-text"> <span class="icon fas fa-language"></span><span class="btn-text phablet-hide">EN</span> </span> <div class="pop-box pbcols5 arrow-box arrow-box-top anchor-center"> <div class="pop-box-inner pop-box-menu pop-box-menucols"> <ul> <li><a href="/plugin/?lang=ar">العربية</a></li> <li><a href="/plugin/?lang=bg-BG">Български</a></li> <li><a href="/plugin/?lang=bs-BA">Bosanski</a></li> <li><a href="/plugin/?lang=ca">Сatalà</a></li> <li><a href="/plugin/?lang=cs">Čeština</a></li> <li><a href="/plugin/?lang=da">Dansk</a></li> <li><a href="/plugin/?lang=de">Deutsch</a></li> <li><a href="/plugin/?lang=de-DE">Deutsch (Deutschland)</a></li> <li><a href="/plugin/?lang=el">Ελληνικά</a></li> <li class="current"><a href="/plugin/?lang=en">English</a></li> <li><a href="/plugin/?lang=es">Español</a></li> <li><a href="/plugin/?lang=et-EE">Eesti (Eesti)</a></li> <li><a href="/plugin/?lang=fa">فارسی</a></li> <li><a href="/plugin/?lang=fi">Suomi</a></li> <li><a href="/plugin/?lang=fr">Français</a></li> <li><a href="/plugin/?lang=he">עברית</a></li> <li><a href="/plugin/?lang=hr">Hrvatski</a></li> <li><a href="/plugin/?lang=hu">Magyar</a></li> <li><a href="/plugin/?lang=id">Bahasa Indonesia</a></li> <li><a href="/plugin/?lang=it">Italiano</a></li> <li><a href="/plugin/?lang=ja">日本語</a></li> <li><a href="/plugin/?lang=ko">한국어</a></li> <li><a href="/plugin/?lang=lt-LT">Lietuvių (Lietuva)</a></li> <li><a href="/plugin/?lang=nb">‪Norsk Bokmål‬</a></li> <li><a href="/plugin/?lang=nl">Nederlands</a></li> <li><a href="/plugin/?lang=pl">Polski</a></li> <li><a href="/plugin/?lang=pt">Português</a></li> <li><a href="/plugin/?lang=pt-BR">Português (Brasil)</a></li> <li><a href="/plugin/?lang=ro">Română</a></li> <li><a href="/plugin/?lang=ru">Русский</a></li> <li><a href="/plugin/?lang=sk">Slovenčina</a></li> <li><a href="/plugin/?lang=sr-RS">Српски</a></li> <li><a href="/plugin/?lang=sv">Svenska</a></li> <li><a href="/plugin/?lang=th">ไทย</a></li> <li><a href="/plugin/?lang=tr">Türkçe</a></li> <li><a href="/plugin/?lang=uk">Українська</a></li> <li><a href="/plugin/?lang=vi">Tiếng Việt</a></li> <li><a href="/plugin/?lang=zh-CN">简体中文</a></li> <li><a href="/plugin/?lang=zh-TW">繁體中文</a></li> </ul> </div> </div> </li> <li data-nav="about" class="phone-hide pop-btn pop-keep-click"> <span class="top-btn-text"> <span class="icon far fa-question-circle"></span><span class="btn-text phone-hide phablet-hide laptop-hide tablet-hide desktop-hide">About</span> </span> <div class="pop-box arrow-box arrow-box-top anchor-right"> <div class="pop-box-inner pop-box-menu"> <ul> <li class="with-icon"><a href="/page/tos"><span class="btn-icon fas fa-landmark"></span> Terms of Service</a> </li> <li class="with-icon"><a href="/page/privacy"><span class="btn-icon fas fa-lock"></span> Privacy Policy</a> </li> <li class="with-icon"><a href="/page/contact"><span class="btn-icon fas fa-at"></span> Contact</a> </li> <li class="with-icon"><a href="/plugin"><span class="btn-icon fas fa-code"></span> Plugin</a> </li> </ul> </div> </div> </li> </ul> </div> </header> <div class="center-box c24 margin-top-20"> <div class="content-width"> <div class="header default-margin-bottom"> <h1 class="header-title">Upload plugin</h1> </div> <div class="text-content"> <p>Add image uploading to your website, blog or forum by installing our upload plugin. It provides image uploading to any website by placing a button that will allow your users to directly upload images to our service and it will automatically handle the codes needed for insertion. All features included like drag and drop, remote upload, image resizing and more.</p> <h2>Supported software</h2> <p>The plugin works in any website with user-editable content and for <a data-toggle="pup-vendors">supported software</a>, it will place an upload button that will match the target editor toolbar so no extra customization is needed.</p> <ul data-content="pup-vendors" class="soft-hidden"> <li>bbPress</li> <li>Discourse</li> <li>Discuz!</li> <li>Invision Power Board</li> <li>MyBB</li> <li>NodeBB</li> <li>ProBoards</li> <li>phpBB</li> <li>Simple Machines Forum</li> <li>Vanilla Forums</li> <li>vBulletin</li> <li>WoltLab</li> <li>XenForo</li> </ul> <h2>Add it to your website</h2> <p>Copy and paste the plugin code into your website HTML code (preferably inside the head section). There are plenty <a data-toggle="pup-options">options</a> to make it fit better to your needs.</p> <div class="input-label margin-bottom-0"> <textarea id="pup-insert-code" data-focus="select-all" class="r2 resize-vertical" autocomplete="off" spellcheck="false" readonly>&lt;script async src=&quot;//hotimg.com/sdk/pup.js&quot; data-url=&quot;https://hotimg.com/upload&quot;&gt;&lt;/script&gt;</textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#pup-insert-code"><i class="far fa-copy"></i> copy</button> </div> <div><style type="text/css" id="chevereto-pup-style">.chevereto-pup-container{display:inline-block;margin-top:5px;margin-bottom:5px}.chevereto-pup-button{-webkit-transition:all .2s;-o-transition:all .2s;transition:all .2s;outline:0;border:none;cursor:pointer;border:1px solid rgba(0,0,0,.05);border-radius:.2em;padding:.5em 1em;font-size:12px;font-weight:700;text-shadow:none}.chevereto-pup-button:hover{border-top-color:rgba(255,255,255,.1);border-right-color:rgba(0,0,0,.05);border-bottom-color:rgba(0,0,0,.1);border-left-color:rgba(0,0,0,.05);}.chevereto-pup-button-icon{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-item-align:center;align-self:center;position:relative;height:1em;width:1em;margin-right:.25em}.chevereto-pup-button-icon img,.chevereto-pup-button-icon svg{width:1em;height:1em;bottom:-.125em;position:absolute}.chevereto-pup-button-icon svg{fill:currentColor}.chevereto-pup-button--palette-default{color:#000;background:#ececec}.chevereto-pup-button--palette-default:hover{background:#2980b9;color:#fff}.chevereto-pup-button--palette-clear{color:inherit;background:inherit}.chevereto-pup-button--palette-clear:hover{background:inherit;color:#2980b9}.chevereto-pup-button--palette-turquoise{color:#fff;background:#16a085}.chevereto-pup-button--palette-turquoise:hover{background:#1abc9c;color:#fff}.chevereto-pup-button--palette-green{color:#fff;background:#27ae60}.chevereto-pup-button--palette-green:hover{background:#2ecc71;color:#fff}.chevereto-pup-button--palette-blue{color:#fff;background:#2980b9}.chevereto-pup-button--palette-blue:hover{background:#3498db;color:#fff}.chevereto-pup-button--palette-purple{color:#fff;background:#8e44ad}.chevereto-pup-button--palette-purple:hover{background:#9b59b6;color:#fff}.chevereto-pup-button--palette-darkblue{color:#fff;background:#2c3e50}.chevereto-pup-button--palette-darkblue:hover{background:#34495e;color:#fff}.chevereto-pup-button--palette-yellow{color:#fff;background:#f39c12}.chevereto-pup-button--palette-yellow:hover{background:#f1c40f;color:#fff}.chevereto-pup-button--palette-orange{color:#fff;background:#d35400}.chevereto-pup-button--palette-orange:hover{background:#e67e22;color:#fff}.chevereto-pup-button--palette-red{color:#fff;background:#c0392b}.chevereto-pup-button--palette-red:hover{background:#e74c3c;color:#fff}.chevereto-pup-button--palette-grey{color:#000;background:#ececec}.chevereto-pup-button--palette-grey:hover{background:#e0e0e0;color:#000}.chevereto-pup-button--palette-black{color:#fff;background:#333}.chevereto-pup-button--palette-black:hover{background:#666;color:#fff}</style><div class="chevereto-pup-container"><button id="pup-preview" class="chevereto-pup-button chevereto-pup-button--palette-default"><span class="chevereto-pup-button-icon"><svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M76.7 87.5c12.8 0 23.3-13.3 23.3-29.4 0-13.6-5.2-25.7-15.4-27.5 0 0-3.5-0.7-5.6 1.7 0 0 0.6 9.4-2.9 12.6 0 0 8.7-32.4-23.7-32.4 -29.3 0-22.5 34.5-22.5 34.5 -5-6.4-0.6-19.6-0.6-19.6 -2.5-2.6-6.1-2.5-6.1-2.5C10.9 25 0 39.1 0 54.6c0 15.5 9.3 32.7 29.3 32.7 2 0 6.4 0 11.7 0V68.5h-13l22-22 22 22H59v18.8C68.6 87.4 76.7 87.5 76.7 87.5z"/></svg></span><span class="%tClass">Upload images</span></button></div></div> <div data-content="pup-options" class="soft-hidden"> <h3>Basic options</h3> <div class="input-label margin-top-0"> <label for="palette">Color palette</label> <div class="c9 phablet-c1"> <select type="text" name="palette" id="palette" class="text-input"> <option value="" selected="selected">Default</option> <option value="clear">Clear</option> <option value="turquoise">Turquoise</option> <option value="green">Green</option> <option value="blue">Blue</option> <option value="purple">Purple</option> <option value="darkblue">Darkblue</option> <option value="yellow">Yellow</option> <option value="orange">Orange</option> <option value="red">Red</option> <option value="grey">Grey</option> <option value="black">Black</option> </select> </div> <div class="input-below">Button color scheme</div> </div> <div class="input-label"> <label for="auto-insert">Embed codes</label> <div class="c9 phablet-c1"> <select type="text" name="auto-insert" id="auto-insert" class="text-input"> <option value="viewer-links">Viewer links</option> <option value="direct-links">Direct links</option> <option value="html-embed">HTML image</option> <option value="html-embed-full">HTML full linked</option> <option value="html-embed-medium">HTML medium linked</option> <option value="html-embed-thumbnail">HTML thumbnail linked</option> <option value="bbcode-embed">BBCode full</option> <option value="bbcode-embed-full">BBCode full linked</option> <option value="" selected="selected">BBCode medium linked</option> <option value="bbcode-embed-thumbnail">BBCode thumbnail linked</option> <option value="markdown-embed">Markdown full</option> <option value="markdown-embed-full">Markdown full linked</option> <option value="markdown-embed-medium">Markdown medium linked</option> <option value="markdown-embed-thumbnail">Markdown thumbnail linked</option> </select> </div> <div class="input-below">Embed codes that will be auto-inserted in editor box</div> </div> <div class="input-label"> <label for="sibling">Sibling selector</label> <div class="c9 phablet-c1"> <input type="text" name="sibling" id="sibling" class="text-input" placeholder="Empty string"> </div> <div class="input-below">Sibling element selector where to place the button next to</div> </div> <div class="input-label"> <label for="sibling-pos">Sibling position</label> <div class="c9 phablet-c1"> <select type="text" name="sibling-pos" id="sibling-pos" class="text-input"> <option value="" selected="selected">After</option> <option value="before">Before</option> </select> </div> <div class="input-below">Position relative to sibling element</div> </div> <div class="clear-both"> <h3>Advanced options</h3> <p>The plugin has a large set of additional options that allow full customization. You can use custom HTML, CSS, own color palette, set observers and more. Check the <a rel="external" href="https://chv.to/v4pup" target="_blank">documentation</a> and the plugin source to get a better idea of these advanced options.</p> </div> </div> </div> </div> </div> <script> $(document).ready(function() { if(typeof CHV == "undefined") { CHV = {obj: {}, fn: {}, str:{}}; } else { if(typeof CHV.obj.embed_share_tpl == "undefined") { CHV.obj.embed_share_tpl = {}; } if(typeof CHV.obj.embed_upload_tpl == "undefined") { CHV.obj.embed_upload_tpl = {}; } } CHV.obj.embed_share_tpl = {"links":{"label":"Links","options":{"viewer-links":{"label":"Viewer links","template":"%URL_VIEWER%","size":"viewer"},"direct-links":{"label":"Direct links","template":"%URL%","size":"full"}}},"html-codes":{"label":"HTML Codes","options":{"html-embed":{"label":"HTML image","template":"<img src=\"%URL%\" alt=\"%FILENAME%\" border=\"0\">","size":"full"},"html-embed-full":{"label":"HTML full linked","template":"<a href=\"%URL_VIEWER%\"><img src=\"%URL%\" alt=\"%FILENAME%\" border=\"0\"><\/a>","size":"full"},"html-embed-medium":{"label":"HTML medium linked","template":"<a href=\"%URL_VIEWER%\"><img src=\"%MEDIUM_URL%\" alt=\"%MEDIUM_FILENAME%\" border=\"0\"><\/a>","size":"medium"},"html-embed-thumbnail":{"label":"HTML thumbnail linked","template":"<a href=\"%URL_VIEWER%\"><img src=\"%THUMB_URL%\" alt=\"%THUMB_FILENAME%\" border=\"0\"><\/a>","size":"thumb"}}},"bbcodes":{"label":"BBCodes","options":{"bbcode-embed":{"label":"BBCode full","template":"[img]%URL%[\/img]","size":"full"},"bbcode-embed-full":{"label":"BBCode full linked","template":"[url=%URL_VIEWER%][img]%URL%[\/img][\/url]","size":"full"},"bbcode-embed-medium":{"label":"BBCode medium linked","template":"[url=%URL_VIEWER%][img]%MEDIUM_URL%[\/img][\/url]","size":"medium"},"bbcode-embed-thumbnail":{"label":"BBCode thumbnail linked","template":"[url=%URL_VIEWER%][img]%THUMB_URL%[\/img][\/url]","size":"thumb"}}},"markdown":{"label":"Markdown","options":{"markdown-embed":{"label":"Markdown full","template":"![%FILENAME%](%URL%)","size":"full"},"markdown-embed-full":{"label":"Markdown full linked","template":"[![%FILENAME%](%URL%)](%URL_VIEWER%)","size":"full"},"markdown-embed-medium":{"label":"Markdown medium linked","template":"[![%MEDIUM_FILENAME%](%MEDIUM_URL%)](%URL_VIEWER%)","size":"medium"},"markdown-embed-thumbnail":{"label":"Markdown thumbnail linked","template":"[![%THUMB_FILENAME%](%THUMB_URL%)](%URL_VIEWER%)","size":"thumb"}}}}; CHV.obj.embed_upload_tpl = {"links":{"label":"Links","options":{"viewer-links":{"label":"Viewer links","template":"%URL_VIEWER%","size":"viewer"},"direct-links":{"label":"Direct links","template":"%URL%","size":"full"},"delete-links":{"label":"Delete links","template":"%DELETE_URL%","size":"full"}}},"html-codes":{"label":"HTML Codes","options":{"html-embed":{"label":"HTML image","template":"<img src=\"%URL%\" alt=\"%FILENAME%\" border=\"0\">","size":"full"},"html-embed-full":{"label":"HTML full linked","template":"<a href=\"%URL_VIEWER%\"><img src=\"%URL%\" alt=\"%FILENAME%\" border=\"0\"><\/a>","size":"full"},"html-embed-medium":{"label":"HTML medium linked","template":"<a href=\"%URL_VIEWER%\"><img src=\"%MEDIUM_URL%\" alt=\"%MEDIUM_FILENAME%\" border=\"0\"><\/a>","size":"medium"},"html-embed-thumbnail":{"label":"HTML thumbnail linked","template":"<a href=\"%URL_VIEWER%\"><img src=\"%THUMB_URL%\" alt=\"%THUMB_FILENAME%\" border=\"0\"><\/a>","size":"thumb"}}},"bbcodes":{"label":"BBCodes","options":{"bbcode-embed":{"label":"BBCode full","template":"[img]%URL%[\/img]","size":"full"},"bbcode-embed-full":{"label":"BBCode full linked","template":"[url=%URL_VIEWER%][img]%URL%[\/img][\/url]","size":"full"},"bbcode-embed-medium":{"label":"BBCode medium linked","template":"[url=%URL_VIEWER%][img]%MEDIUM_URL%[\/img][\/url]","size":"medium"},"bbcode-embed-thumbnail":{"label":"BBCode thumbnail linked","template":"[url=%URL_VIEWER%][img]%THUMB_URL%[\/img][\/url]","size":"thumb"}}},"markdown":{"label":"Markdown","options":{"markdown-embed":{"label":"Markdown full","template":"![%FILENAME%](%URL%)","size":"full"},"markdown-embed-full":{"label":"Markdown full linked","template":"[![%FILENAME%](%URL%)](%URL_VIEWER%)","size":"full"},"markdown-embed-medium":{"label":"Markdown medium linked","template":"[![%MEDIUM_FILENAME%](%MEDIUM_URL%)](%URL_VIEWER%)","size":"medium"},"markdown-embed-thumbnail":{"label":"Markdown thumbnail linked","template":"[![%THUMB_FILENAME%](%THUMB_URL%)](%URL_VIEWER%)","size":"thumb"}}}}; }); </script> <div data-modal="form-embed-codes" class="hidden"> <span class="modal-box-title"><i class="fas fa-code"></i> Embed codes</span> <div class="image-preview"></div> <div class="input-label margin-bottom-0"> <div class="c8 margin-bottom-10"> <select name="form-embed-toggle" id="form-embed-toggle" class="text-input" data-combo="form-embed-toggle-combo"> <optgroup label="Links"> <option value="viewer-links" data-size="viewer">Viewer links</option> <option value="direct-links" data-size="full">Direct links</option> </optgroup><optgroup label="HTML Codes"> <option value="html-embed" data-size="full">HTML image</option> <option value="html-embed-full" data-size="full">HTML full linked</option> <option value="html-embed-medium" data-size="medium">HTML medium linked</option> <option value="html-embed-thumbnail" data-size="thumb">HTML thumbnail linked</option> </optgroup><optgroup label="BBCodes"> <option value="bbcode-embed" data-size="full">BBCode full</option> <option value="bbcode-embed-full" data-size="full">BBCode full linked</option> <option value="bbcode-embed-medium" data-size="medium">BBCode medium linked</option> <option value="bbcode-embed-thumbnail" data-size="thumb">BBCode thumbnail linked</option> </optgroup><optgroup label="Markdown"> <option value="markdown-embed" data-size="full">Markdown full</option> <option value="markdown-embed-full" data-size="full">Markdown full linked</option> <option value="markdown-embed-medium" data-size="medium">Markdown medium linked</option> <option value="markdown-embed-thumbnail" data-size="thumb">Markdown thumbnail linked</option> </optgroup> </select> </div> <div id="form-embed-toggle-combo"> <div data-combo-value="viewer-links" class="switch-combo"> <textarea id="modal-embed-code-0" class="r3 resize-vertical" name="viewer-links" data-size="viewer" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-0"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="direct-links" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-1" class="r3 resize-vertical" name="direct-links" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-1"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="html-embed" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-2" class="r3 resize-vertical" name="html-embed" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-2"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="html-embed-full" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-3" class="r3 resize-vertical" name="html-embed-full" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-3"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="html-embed-medium" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-4" class="r3 resize-vertical" name="html-embed-medium" data-size="medium" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-4"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="html-embed-thumbnail" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-5" class="r3 resize-vertical" name="html-embed-thumbnail" data-size="thumb" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-5"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="bbcode-embed" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-6" class="r3 resize-vertical" name="bbcode-embed" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-6"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="bbcode-embed-full" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-7" class="r3 resize-vertical" name="bbcode-embed-full" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-7"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="bbcode-embed-medium" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-8" class="r3 resize-vertical" name="bbcode-embed-medium" data-size="medium" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-8"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="bbcode-embed-thumbnail" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-9" class="r3 resize-vertical" name="bbcode-embed-thumbnail" data-size="thumb" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-9"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="markdown-embed" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-10" class="r3 resize-vertical" name="markdown-embed" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-10"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="markdown-embed-full" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-11" class="r3 resize-vertical" name="markdown-embed-full" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-11"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="markdown-embed-medium" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-12" class="r3 resize-vertical" name="markdown-embed-medium" data-size="medium" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-12"><i class="far fa-copy"></i> copy</button> </div> <div data-combo-value="markdown-embed-thumbnail" class="switch-combo soft-hidden"> <textarea id="modal-embed-code-13" class="r3 resize-vertical" name="markdown-embed-thumbnail" data-size="thumb" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-embed-code-13"><i class="far fa-copy"></i> copy</button> </div> </div> </div> </div> <div id="anywhere-upload" class="no-select upload-box upload-box--fixed upload-box--hidden queueEmpty" data-queue-size="0"> <div class="content-width"> <div class="upload-box-inner"> <div class="upload-box-heading c18 center-box"> <div class="upload-box-status"> <div data-group="upload"> <span class="icon fas fa-photo-video color-accent cursor-pointer" data-trigger="anywhere-upload-input"></span> <div class="heading device-mobile--hide"><a data-trigger="anywhere-upload-input">Drag and drop or paste images here to upload</a></div> <div class="heading device-nonmobile--hide"><a data-trigger="anywhere-upload-input">Select the images to upload</a></div> <div class="device-mobile--hide upload-box-status-text">You can also <a data-trigger="anywhere-upload-input"><i class="fas fa-folder-plus margin-right-5"></i>browse from your computer</a>.</div> <div class="device-nonmobile--hide upload-box-status-text">You can also <a data-trigger="anywhere-upload-input"><i class="fas fa-folder-plus margin-right-5"></i>browse from your device</a> or <a data-trigger="anywhere-upload-input-camera"><i class="fas fa-camera margin-right-5"></i>take a picture</a>.</div> <div class="upload-box-allowed-files margin-top-10"> <span>JPG JPEG PNG BMP GIF WEBP</span> <span class="margin-left-5">32 MB <span class="fas fa-exclamation-triangle" rel="tooltip" data-tiptip="top" title="Register to get 2 MB"></span> </span> </div> </div> <div data-group="upload-queue-ready" class="soft-hidden"> <span class="icon fas fa-photo-video color-accent cursor-pointer" data-trigger="anywhere-upload-input"></span> <div class="heading device-mobile--hide">Customize upload by clicking on any preview</div> <div class="heading device-nonmobile--hide">Customize upload by touching on any preview</div> <div class="device-mobile--hide upload-box-status-text">You can also <a data-trigger="anywhere-upload-input"><i class="fas fa-folder-plus margin-right-5"></i>browse from your computer</a>.</div> <div class="device-nonmobile--hide upload-box-status-text">You can also <a data-trigger="anywhere-upload-input"><i class="fas fa-folder-plus margin-right-5"></i>browse from your device</a> or <a data-trigger="anywhere-upload-input-camera"><i class="fas fa-camera margin-right-5"></i>take a picture</a>.</div> </div> <div data-group="uploading" class="soft-hidden"> <span class="icon fas fa-cloud-upload-alt color-accent"></span> <div class="heading">Uploading <span data-text="queue-size">0</span> <span data-text="queue-objects">files</span> (<span data-text="queue-progress">0</span>% complete)</div> <div class="upload-box-status-text">The queue is being uploaded, it should take just a few seconds to complete.</div> </div> <div data-group="upload-result" data-result="success" class="soft-hidden"> <span class="icon fas fa-check-circle color-success"></span> <div class="heading">Upload complete</div> <div class="upload-box-status-text"> <div data-group="user" class="soft-hidden"> <div data-group="user-stream" class="soft-hidden"> Uploaded content added to <a data-link="upload-target"><i class="fas fa-user margin-right-5"></i><span data-text="upload-target"></span></a>. You can <a data-modal="form" data-target="form-uploaded-create-album"><i class="fas fa-images margin-right-5"></i>create new album</a> with the content just uploaded. </div> <div data-group="user-album" class="soft-hidden">Uploaded content added to <a data-link="upload-target"><i class="fas fa-user margin-right-5"></i><span data-text="upload-target"></span></a>.</div> </div> <div data-group="guest" class="soft-hidden"> You can <a data-modal="form" data-target="form-uploaded-create-album"><i class="fas fa-images margin-right-5"></i>create new album</a> with the content just uploaded. You must <a href="/signup"><i class="fas fa-user-plus margin-right-5"></i>create an account</a> or <a href="/login"><i class="fas fa-sign-in-alt margin-right-5"></i>sign in</a> to save this content into your account. </div> </div> </div> <div data-group="upload-result" data-result="error" class="soft-hidden"> <span class="icon fas fa-times color-fail"></span> <div class="heading">No <span data-text="queue-objects">file</span> have been uploaded</div> <div class="upload-box-status-text">Some errors have occurred and the system couldn't process your request.</div> </div> </div> </div> <input id="anywhere-upload-input" data-action="anywhere-upload-input" class="hidden-visibility" type="file" accept="image/*, .jpg,.jpeg,.png,.bmp,.gif,.webp,.jpeg" multiple> <input id="anywhere-upload-input-camera" data-action="anywhere-upload-input" class="hidden-visibility" type="file" capture="camera" accept="image/*"> <ul id="anywhere-upload-queue" class="upload-box-queue content-width soft-hidden" data-group="upload-queue"></ul> <div id="anywhere-upload-submit" class="btn-container text-align-center margin-bottom-0 soft-hidden" data-group="upload-queue-ready"> <div data-group="upload-queue-ready"> <div class="input-label upload-input-col center-box text-align-left"> <label for="upload-expiration">Auto delete</label> <select type="text" name="upload-expiration" id="upload-expiration" class="text-input"> <option value="" selected>Don't autodelete</option> <option value="PT5M">After 5 minutes</option> <option value="PT15M">After 15 minutes</option> <option value="PT30M">After 30 minutes</option> <option value="PT1H">After 1 hour</option> <option value="PT3H">After 3 hours</option> <option value="PT6H">After 6 hours</option> <option value="PT12H">After 12 hours</option> <option value="P1D">After 1 day</option> <option value="P2D">After 2 days</option> <option value="P3D">After 3 days</option> <option value="P4D">After 4 days</option> <option value="P5D">After 5 days</option> <option value="P6D">After 6 days</option> <option value="P1W">After 1 week</option> <option value="P2W">After 2 weeks</option> <option value="P3W">After 3 weeks</option> <option value="P1M">After 1 month</option> <option value="P2M">After 2 months</option> <option value="P3M">After 3 months</option> <option value="P4M">After 4 months</option> <option value="P5M">After 5 months</option> <option value="P6M">After 6 months</option> <option value="P1Y">After 1 year</option> </select> </div> <div class="margin-20"><span rel="tooltip" data-tiptip="top" title="Mark this if the upload is not family safe"><input type="checkbox" name="upload-nsfw" id="upload-nsfw" class="margin-right-5" value="1"><label for="upload-nsfw">Not family safe upload</label></span></div> <div class="margin-20"><input type="checkbox" name="upload-tos" id="upload-tos" class="margin-right-5" value="1"><label for="upload-tos">I agree to the <a href="/page/tos">terms</a> and <a href="/page/privacy">privacy policy</a></label></div> <button class="btn btn-big accent" data-action="upload" data-public="Upload" data-private="Private upload"><i class="fas fa-cloud-upload-alt"></i> Upload</button> </div> <div data-group="uploading" class="soft-hidden"> <button class="btn plain disabled btn-big plain margin-right-5" disabled data-action="upload-privacy-copy"><span class="icon fas fa-lock-open" data-lock="fa-lock" data-unlock="fa-lock-open"></span></button><button class="btn btn-big disabled off" disabled>Uploading</button> <span class="btn-alt">or <a data-action="cancel-upload" data-button="close-cancel">cancel</a><a data-action="cancel-upload-remaining" data-button="close-cancel" class="soft-hidden">cancel remaining</a></span> </div> </div> <div id="anywhere-upload-report"> <div data-group="upload-result" data-result="mixted" class="soft-hidden margin-top-10 text-align-center upload-box-status-text">Note: Some files couldn't be uploaded. <a data-modal="simple" data-target="failed-upload-result">learn more</a></div> <div data-group="upload-result" data-result="error" class="soft-hidden margin-top-10 text-align-center upload-box-status-text">Check the <a data-modal="simple" data-target="failed-upload-result">error report</a> for more information.</div> </div> <div class="upload-box-close position-absolute"> <a class="btn btn-small default" data-action="reset-upload" data-button="close-cancel"><span class="btn-icon fas fa-undo"></span><span class="btn-text">reset</span></a> <a class="btn btn-small default" data-action="cancel-upload" data-button="close-cancel"><span class="btn-icon fas fa-times"></span><span class="btn-text">cancel</span></a> <a class="btn btn-small default" data-action="cancel-upload-remaining" data-button="close-cancel"><span class="btn-icon fas fa-times"></span><span class="btn-text">cancel remaining</span></a> </div> <div data-group="upload-result" data-result="success" class="c18 center-box soft-hidden"> <div class="input-label margin-bottom-0"> <label for="uploaded-embed-toggle">Embed codes</label> <div class="c8 margin-bottom-10"> <select name="uploaded-embed-toggle" id="uploaded-embed-toggle" class="text-input" data-combo="uploaded-embed-toggle-combo"> <optgroup label="Links"> <option value="viewer-links" data-size="viewer">Viewer links</option> <option value="direct-links" data-size="full">Direct links</option> <option value="delete-links" data-size="full">Delete links</option> </optgroup><optgroup label="HTML Codes"> <option value="html-embed" data-size="full">HTML image</option> <option value="html-embed-full" data-size="full">HTML full linked</option> <option value="html-embed-medium" data-size="medium">HTML medium linked</option> <option value="html-embed-thumbnail" data-size="thumb">HTML thumbnail linked</option> </optgroup><optgroup label="BBCodes"> <option value="bbcode-embed" data-size="full">BBCode full</option> <option value="bbcode-embed-full" data-size="full">BBCode full linked</option> <option value="bbcode-embed-medium" data-size="medium">BBCode medium linked</option> <option value="bbcode-embed-thumbnail" data-size="thumb">BBCode thumbnail linked</option> </optgroup><optgroup label="Markdown"> <option value="markdown-embed" data-size="full">Markdown full</option> <option value="markdown-embed-full" data-size="full">Markdown full linked</option> <option value="markdown-embed-medium" data-size="medium">Markdown medium linked</option> <option value="markdown-embed-thumbnail" data-size="thumb">Markdown thumbnail linked</option> </optgroup> </select> </div> <div id="uploaded-embed-toggle-combo"> <div data-combo-value="viewer-links" class="switch-combo"> <textarea id="uploaded-embed-code-0" class="r2 resize-vertical" name="viewer-links" data-size="viewer" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-0"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-0">insert</button> </div> <div data-combo-value="direct-links" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-1" class="r2 resize-vertical" name="direct-links" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-1"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-1">insert</button> </div> <div data-combo-value="delete-links" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-2" class="r2 resize-vertical" name="delete-links" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-2"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-2">insert</button> </div> <div data-combo-value="html-embed" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-3" class="r2 resize-vertical" name="html-embed" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-3"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-3">insert</button> </div> <div data-combo-value="html-embed-full" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-4" class="r2 resize-vertical" name="html-embed-full" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-4"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-4">insert</button> </div> <div data-combo-value="html-embed-medium" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-5" class="r2 resize-vertical" name="html-embed-medium" data-size="medium" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-5"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-5">insert</button> </div> <div data-combo-value="html-embed-thumbnail" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-6" class="r2 resize-vertical" name="html-embed-thumbnail" data-size="thumb" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-6"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-6">insert</button> </div> <div data-combo-value="bbcode-embed" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-7" class="r2 resize-vertical" name="bbcode-embed" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-7"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-7">insert</button> </div> <div data-combo-value="bbcode-embed-full" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-8" class="r2 resize-vertical" name="bbcode-embed-full" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-8"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-8">insert</button> </div> <div data-combo-value="bbcode-embed-medium" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-9" class="r2 resize-vertical" name="bbcode-embed-medium" data-size="medium" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-9"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-9">insert</button> </div> <div data-combo-value="bbcode-embed-thumbnail" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-10" class="r2 resize-vertical" name="bbcode-embed-thumbnail" data-size="thumb" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-10"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-10">insert</button> </div> <div data-combo-value="markdown-embed" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-11" class="r2 resize-vertical" name="markdown-embed" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-11"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-11">insert</button> </div> <div data-combo-value="markdown-embed-full" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-12" class="r2 resize-vertical" name="markdown-embed-full" data-size="full" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-12"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-12">insert</button> </div> <div data-combo-value="markdown-embed-medium" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-13" class="r2 resize-vertical" name="markdown-embed-medium" data-size="medium" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-13"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-13">insert</button> </div> <div data-combo-value="markdown-embed-thumbnail" class="switch-combo soft-hidden"> <textarea id="uploaded-embed-code-14" class="r2 resize-vertical" name="markdown-embed-thumbnail" data-size="thumb" data-focus="select-all"></textarea> <button type="button" class="input-action" data-action="copy" data-action-target="#uploaded-embed-code-14"><i class="far fa-copy"></i> copy</button> <button class="input-action" data-action="openerPostMessage" data-action-target="#uploaded-embed-code-14">insert</button> </div> </div> </div> </div> </div> </div> <div class="hidden"> <div id="anywhere-upload-item-template"> <li class="queue-item"> <a class="block image-link" data-group="image-link" href="#file" target="_blank"></a> <div class="result done block"><span class="icon fas fa-check-circle color-white"></span></div> <div class="result failed block"><span class="icon fas fa-exclamation-triangle color-fail"></span></div> <div class="load-url block"><span class="big-icon fas fa-network-wired"></span></div> <div class="preview block checkered-background"></div> <div class="progress block"> <div class="progress-bar" data-content="progress-bar"></div> </div> <div class="block edit" data-action="edit" title="Edit"> </div> <div class="queue-item-button cancel hover-display" data-action="cancel" title="Remove"> <span class="icon fas fa-times"></span> </div> </li> </div> <div id="anywhere-upload-edit-item"> <span class="modal-box-title"><i class="fas fa-edit"></i> Edit upload</span> <div class="modal-form"> <div class="image-preview"></div> <div class="input-label"> <label for="form-title">Title <span class="optional">optional</span></label> <input type="text" id="form-title" name="form-title" class="text-input" value="" maxlength="100"> </div> <div class="input-label" data-action="resize-combo-input"> <label for="form-width" class="display-block-forced">Resize image</label> <div class="c6 overflow-auto clear-both"> <div class="c3 float-left"> <input type="number" min="16" pattern="\d+" name="form-width" id="form-width" class="text-input" title="Width" rel="template-tooltip" data-tiptip="top"> </div> <div class="c3 float-left margin-left-10"> <input type="number" min="16" pattern="\d+" name="form-height" id="form-height" class="text-input" title="Height" rel="template-tooltip" data-tiptip="top"> </div> </div> <div class="input-below font-size-small" data-content="animated-gif-warning">Note: Animated GIF images won't be resized.</div> </div> <div class="input-label"> <label for="form-expiration">Auto delete</label> <div class="c6 phablet-1"> <select type="text" name="form-expiration" id="form-expiration" class="text-input"> <option value="" selected>Don't autodelete</option> <option value="PT5M">After 5 minutes</option> <option value="PT15M">After 15 minutes</option> <option value="PT30M">After 30 minutes</option> <option value="PT1H">After 1 hour</option> <option value="PT3H">After 3 hours</option> <option value="PT6H">After 6 hours</option> <option value="PT12H">After 12 hours</option> <option value="P1D">After 1 day</option> <option value="P2D">After 2 days</option> <option value="P3D">After 3 days</option> <option value="P4D">After 4 days</option> <option value="P5D">After 5 days</option> <option value="P6D">After 6 days</option> <option value="P1W">After 1 week</option> <option value="P2W">After 2 weeks</option> <option value="P3W">After 3 weeks</option> <option value="P1M">After 1 month</option> <option value="P2M">After 2 months</option> <option value="P3M">After 3 months</option> <option value="P4M">After 4 months</option> <option value="P5M">After 5 months</option> <option value="P6M">After 6 months</option> <option value="P1Y">After 1 year</option> </select> </div> </div> <div class="checkbox-label"> <div class="display-inline" rel="template-tooltip" data-tiptip="right" data-title="Mark this if the image is not family safe"> <label for="form-nsfw"> <input class="float-left" type="checkbox" name="form-nsfw" id="form-nsfw" value="1">Flag as unsafe </label> </div> </div> <div class="input-label"> <label for="form-description">Description <span class="optional">optional</span></label> <textarea id="form-description" name="form-description" class="text-input no-resize" placeholder="Brief description of this image"></textarea> </div> </div> </div> </div> <div data-modal="form-uploaded-create-album" class="hidden" data-is-xhr data-submit-fn="CHV.fn.submit_upload_edit" data-ajax-deferred="CHV.fn.complete_upload_edit"> <span class="modal-box-title"><i class="fas fa-images"></i> Create album</span> <p>The uploaded content will be moved to this newly created album. You must <a href="/signup"><i class="fas fa-user-plus margin-right-5"></i>create an account</a> or <a href="/login"><i class="fas fa-sign-in-alt margin-right-5"></i>sign in</a> if you want to edit this album later on.</p> <div class="modal-form"> <div name="move-new-album" id="move-new-album" data-content="form-new-album" data-view="switchable"> <div class="input-label"> <label for="form-album-name">Name</label> <input type="text" name="form-album-name" id="form-album-name" class="text-input" value="" placeholder="Unnamed album" maxlength="100" required autocomplete="off"> </div> <div class="input-label"> <label for="form-album-description">Description <span class="optional">optional</span></label> <textarea id="form-album-description" name="form-album-description" class="text-input no-resize" placeholder="Brief description of this album"></textarea> </div> <div class="input-label overflow-auto"> <div class="c8 grid-columns"> <label for="form-privacy">Privacy</label> <select name="form-privacy" id="form-privacy" class="text-input" data-combo="form-privacy-combo" rel="template-tooltip" data-tiptip="right" data-title="Who can view this content"> <option value="public">Public</option><option disabled value="private">Private (just me)</option><option value="private_but_link">Private (anyone with the link)</option><option value="password">Private (password protected)</option> </select> </div> </div> <div id="form-privacy-combo"> <div data-combo-value="password" class="switch-combo soft-hidden"> <div class="input-label overflow-auto"> <div class="c8 grid-columns"> <label for="form-album-password">Password</label> <p></p> <input type="text" name="form-album-password" class="text-input" placeholder="Set password" data-required> </div> </div> </div> </div> </div> </div> </div> <div data-modal="failed-upload-result" class="hidden"> <span class="modal-box-title"><i class="fas fa-exclamation-circle"></i> Error report</span> <ul data-content="failed-upload-result" style="max-height: 115px;" class="overflow-auto"></ul> </div> </div> <div id="modal-share" class="hidden"> <span class="modal-box-title"><i class="fas fa-share-alt"></i> Share</span> <div class="image-preview"></div> <p class="highlight margin-bottom-20 font-size-small text-align-center padding-5" data-content="privacy-private">__privacy_notes__</p> <ul class="panel-share-networks"> </ul> <div class="input-label margin-bottom-0"> <label for="modal-share-url">Link</label> <div class="position-relative"> <input type="text" name="modal-share-url" id="modal-share-url" class="text-input" value="__url__" data-focus="select-all" readonly> <button type="button" class="input-action" data-action="copy" data-action-target="#modal-share-url" value=""><i class="far fa-copy"></i> copy</button> </div> </div> </div> <script defer data-cfasync="false" src="/content/legacy/themes/Peafowl/lib/js/scripts.min.js?76e991ef18f00ccead0908dad1e8ca36" id="jquery-js" onload="jQueryLoaded(this, event)"></script> <script defer data-cfasync="false" src="/content/legacy/themes/Peafowl/lib/peafowl.min.js?76e991ef18f00ccead0908dad1e8ca36" id="peafowl-js"></script> <script defer data-cfasync="false" src="/content/legacy/themes/Peafowl/lib/chevereto.min.js?76e991ef18f00ccead0908dad1e8ca36" id="chevereto-js"></script> <script data-cfasync="false">var CHEVERETO = {"id":"","edition":"Chevereto","version":"4.0.10","source":{"label":"chevereto.com","url":"https:\/\/chevereto.com\/panel\/downloads"},"api":{"download":"https:\/\/chevereto.com\/api\/download","get":{"info":"https:\/\/chevereto.com\/api\/get\/info\/4"}}}</script><script data-cfasync="false"> document.getElementById("chevereto-js").addEventListener("load", function() { PF.obj.devices = window.devices; PF.fn.window_to_device = window.window_to_device; PF.obj.config.base_url = "/"; PF.obj.config.json_api = "/json"; PF.obj.config.listing.items_per_page = "24"; PF.obj.config.listing.device_to_columns = {"phone":"3","phablet":"3","tablet":"4","laptop":"5","desktop":"6","largescreen":"6"}; PF.obj.config.auth_token = "f4182d5b0e60ad83be7a0d0e879679123e4821b6"; PF.obj.l10n = []; if (typeof CHV == "undefined") { CHV = { obj: {}, fn: {}, str: {} }; } CHV.obj.vars = { urls: { home: PF.obj.config.base_url, search: "/search", login: "/login", } }; PF.obj.vars = $.extend({}, CHV.obj.vars); CHV.obj.config = { image: { max_filesize: "32 MB", right_click: false, load_max_filesize: "3 MB", max_width: "0", max_height: "0", }, upload: { url: false, redirect_single_upload: true, threads: "4", image_types: ["jpg","jpeg","png","bmp","gif","webp","jpeg"], moderation: false, maxQueue: null, }, user: { avatar_max_filesize: "1 MB", background_max_filesize: "2 MB", }, captcha: { isNeeded: false, version: '3', enabled: true, sitekey: "6Le4LAYrAAAAAJof7XEdgWJE3y2oPSRU4-FnZdH6", }, listing: { viewer: false, }, palettesId: {"blanco":0,"dark":1,"flickr":2,"imgur":3,"deviantart":4,"lush":5,"graffiti":6,"abstract":7,"cheers":8,"cmyk":9} }; CHV.obj.page_info = {"doctitle":"Upload plugin - HotIMG.com","pre_doctitle":"Upload plugin","pos_doctitle":" - HotIMG.com"}; }); </script> <!-- Google tag (gtag.js) --> <script async src="https://www.googletagmanager.com/gtag/js?id=GT-TQK5X5L2"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'GT-TQK5X5L2'); </script></body> </html> <script> $(function() { var $pluginButton = $("#pup-preview"); var tagAttrs = {"async":"","src":"\/\/hotimg.com\/sdk\/pup.js","data-url":"https:\/\/hotimg.com\/upload"}; var el = document.createElement("script"); for(var key in tagAttrs) { el.setAttribute(key, tagAttrs[key]); } $(document).on("keyup change", "[data-content=pup-options] *:input", function(e) { var attr = 'data-' + $(this).attr("name"); var val = $(this).val(); if(val) { el.setAttribute(attr, val); } else { el.removeAttribute(attr); } $("#pup-insert-code").val(el.outerHTML.replace('=""', '')).highlight(); }); $(document).on("change", "#palette", function(e) { var val = $(this).val() || "default"; $pluginButton.removeClass(function(i, className) { return (className.match (/(^|\s)chevereto-pup-button--palette-\S+/g) || []).join(' '); }).addClass('chevereto-pup-button--palette-' + val); }); }); </script>

Pages: 1 2 3 4 5 6 7 8 9 10