So liebe Kinder, heute lernen wir in wenigen Schritten wie man lange Bilder in sein Profil einfügt.
Ihr benötigt dafür den Google Chrome Browser und mindestens Steam lvl 10 - damit ihr euch ein Showcase im Profil anzeigen lassen könnt.

Folgt mir Schritt für Schritt, dann habt ihr es gleich.

1. Browser Lesezeichen mit Skrypt erstellen.

- Öffnet Google Chrome
- Fügt ein Lesezeichen hinzu
- Name des Lesezeichens ist egal, könnt ihr euch aussuchen
- In die URL des Lesezeichens fügt ihr folgendes Skript ein ( ohne Leerzeichen davor oder dahinter)

javascript:(function(){function a(a){if(!a.firstElementChild.hasAttribute("data-initiated")){a.firstElementChild.setAttribute("data-initiated",1);var b=a.getAttribute("data-eshowcasetype");[].forEach.call(a.querySelectorAll(".screenshot_showcase_primary, .screenshot_showcase_smallscreenshot.showcase_slot"),function(a){a.setAttribute("data-eshowcasetype",b),0==a.clientHeight&&(a.style.minHeight="300px"),a.addEventListener("click",c,!0),a.addEventListener("dragover",d,!0),a.addEventListener("dragleave",e,!1),a.addEventListener("drop",e,!0),a.classList.contains("openslot")||a.classList.add("not-open")})}}function b(b,c){var d=b[0].target;a(d)}function c(a){a.preventDefault(),a.stopPropagation(),k.parentNode&&k.parentNode.removeChild(k),k.target=this,k.click()}function d(a){k.parentNode!==this&&(k.target=this,this.insertBefore(k,this.firstChild)),this.classList.add("dragover")}function e(a){this.classList.remove("dragover")}function f(){this.parentNode&&this.parentNode.removeChild(this);var a=this.cloneNode(!0);a.files=this.files;var b=this.target.getAttribute("data-eshowcasetype"),c=JSON.parse(this.target.getAttribute("data-slotjson")),d=c.slot;if(a.files&&a.files[0]){var e=a.files[0],f=e.name.lastIndexOf("."),h=e.name.substring(f+1).toLowerCase();if(["jpg","png","gif","jpeg"].indexOf(h)<0)return void alert("You can only upload JPG, PNG and GIF files.");if(e.size>10485760)return void alert("You can only upload files less than 10 MB in file size.");g(d,b,a,f)}else alert("No file selected.")}function g(a,b,c,d){var e=c.files[0],f=new FileReader;f.addEventListener("load",function(){var g=new Image;g.addEventListener("load",function(){window.clearTimeout(i);var f=g.width,j=g.height,k=window.prompt("Enter title",e.name.substring(0,d)),l=window.open("/sharedfiles/edititem/767/3/","","width=,height=,resizable=no");l?(l.resizeTo(0,0),l.onload=function(){h(l,k,a,b,c,f,j)}):alert("Allow popups first!")});var i=window.setTimeout(function(){alert("That's not an image!")},500);g.src=f.result}),f.readAsDataURL(e)}function h(a,b,c,d,e,f,g){a.document.body.appendChild(l);var h=a.document.getElementsByName("file")[0];h.parentNode.replaceChild(e,h);var j={13:3,7:5}[d];a.document.getElementsByName("title")[0].value=b,a.document.getElementsByName("agree_terms")[0].checked=!0,0==c&&506==f&&g>506||c>0&&c<4&&100==f&&g>80?(a.document.getElementsByName("image_width")[0].value=1e3,a.document.getElementsByName("image_height")[0].value=1):(a.document.getElementsByName("image_width")[0].value=f,a.document.getElementsByName("image_height")[0].value=g),a.document.getElementsByName("file_type")[0].value=j,a.document.getElementsByName("cloudfilenameprefix")[0].value=Math.trunc(Date.now()/1e3)+"_",a.document.getElementById("Visibility0").checked=!0,a.onunload=function(){function b(){a.location.search.indexOf("fileuploadsuccess")>-1&&(window.clearInterval(e),i(a,c,d))}var e=window.setInterval(b,50)},a.document.getElementById("SubmitItemForm").submit()}function i(a,b,c){var d=a.location.search;if(a.close(),d.indexOf("id=")==-1)return alert("Some error occured. Post your browser, file you wanted to upload and code below to author of this script.\n"+d),void a.close();var e=d.match(/id=(\d+)/)[1];j.push({scType:c,slot:b,id:e,running:!1})}window.setInterval(function(){if(j.length){var a=j[0];if(a.running){var b='div[data-eshowcasetype="'+a.scType+'"] .screenshot_showcase_'+(0==a.slot?"primary":"smallscreenshot:nth-child("+a.slot+")"),c=JSON.parse(document.querySelector(b).getAttribute("data-slotjson"));c.publishedfileid==a.id&&j.shift()}else a.running=!0,PreviewShowcaseConfigWithSlotChange(a.scType,a.slot,{publishedfileid:a.id})}},200);var j=[];window.setTimeout(function(){var a=window.open("/?CLOSE_ME","","width=300,height=");a?a.close():alert("Allow popups!")},1);var k=document.createElement("input");k.type="file",k.name="file",k.style.opacity=0,k.style.position="absolute",k.style.width="100%",k.style.height="100%",k.style.zIndex="9999",k.style.top=0,k.style.left=0,k.setAttribute("multiple",""),k.addEventListener("change",f,!1);var l=document.createElement("div");l.style.position="fixed",l.style.top=0,l.style.left=0,l.style.width="100%",l.style.height="100%",l.style.background="black url('http://steamcommunity-a.akamaihd.net/public/images/login/throbber.gif') center no-repeat",l.style.zIndex=9999999;var m=document.createElement("style");m.innerHTML=".not-open:hover,.dragover{border-color:#FFFFFF%20!important}.not-open{border:2px%20dashed%20#5491CF;border-radius:5px;margin:-2px}.not-open.screenshot_showcase_smallscreenshot{margin-bottom:9px}",document.head.appendChild(m),[].forEach.call(document.querySelectorAll("#showcase_preview_13,%20#showcase_preview_7"),function(c){a(c);var%20d=new%20MutationObserver(b);d.observe(c,{childList:!0})})})();

- Speichert das Lesezeichen.

2. Passende Bilder erstellen.

- Geht in euer Steam Inventar und wählt das gewünschte Profilbild aus.
- Klickt auf "In Originalgröße anzeigen"
- Kopiert den link des Bildes
- Fügt den Link hier ein

https://steam.design/#http://cdn.gtm.steamproxy.vip/economy/image/U8721VM9p9C2v1o6cKJ4qEnGqnE7IoTQgZI-VTdwyTBeimAcIoxXpgK8bPeslY9pPJIvB5IWW2-452kaM8heLSRgleGBoLdIxO94bvMqgbGvW1gh6OdFVjfqThPT1GWSf-yrkFVlMJUodk7zxJ8W7IhRXp95SOL7xcNDXw

- Wenn ihr alles wie gewünscht positioniert habt, klickt Download Zip.
- Entpackt die Bilder

3. Artwork einrichten.

- Loggt euch über Google Chrome in euer Steam Profil ein
- Klickt auf Profil bearbeiten
- Positioniert das Artwork Showcase
- Klickt nun auf das vorher erstellte Lesezeichen, Das Artwork Fenster sollte jetzt umrandet dargestellt sein
- Öffnet den Ordner in dem die Artwork dateien sind und zieht sie per drag and drop auf die gewünschten Artwork Felder
WICHTIG: Der Popup blocker muss im Chrome Browser desktiviert sein!
- Speichern - Fertig

4. Screenshots einrichten

- Öffnet irgendein Spiel über Steam.
- Macht mit F12 ein paar Screenshots
- Verlasst das Spiel
- Lasst euch die Screens vorm hochladen im lokalen Ordner anzeigen
- Nun müsst ihr eure erstellten Hintergrund Bilder in diesen Ordner ziehen und diesen die Namen der Original Steam Screenshots geben.
- Die bearbeiteten Screens über Steam hochladen
- Über Chrome ins Profil einloggen
- Profil bearbeiten
- Screenshot Showcase positionieren
- Die richtigen auswählen
- Speichern und fertig.

Das wars auch schon... Artwork darf bis zu 8 MB groß sein.


Ich würde mich freuen wenn ihr mir ein Feedback in meinem Profil da lasst, damit ich mir mal ansehen kann was ihr euch tolles zusammengebastelt habt.

Viel Spaß!

Grüße -GER- Benzin