Klick auf Link soll Bild-URL bzw. ID in Formular eintragen

  • Hallo,

    vielleicht könnt ihr mir weiterhelfen, wie ich folgende Idee am einfachsten umsetzen kann:

    Klickt man eines meiner Fotos in einer der Bildergalerien an, so öffnet sich das Bild in einer Lightbox. Unter dem Bildtitel befindet sich unter anderem ein Link "Abzug / Lizenz kaufen | Bildanfrage". Über diesen Link gelangt man zum Bildanfrage-Formular (mit Contact Form 7 erstellt).

    Was muss ich im Quellcode des Lightbox-Plugins bei besagtem Link ergänzen, damit die dem Foto entsprechende Bild-URL und/oder die Bild-ID in das dritte Feld von oben ("Fotoauswahl ...") im Formular automatisch eingetragen wird?


    Danke vorab für eure Hilfe.

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Wenn Contact Form 7 $_GET Variablen unterstützt, hängst DU die Attachment ID an den Link zum Formular an und liest die $_GET Variable im dafür vorgesehenen Feld wieder aus (Formidable Pro könnte das).

    WordPress ist "frei" wie in Freiheit es zu nutzen, aber nicht im Sinne von Freibier. Wer also glaubt man bekommt rund um WordPress alles kostenlos, der irrt. Hilfe ist ein Geschenk für das man sich bedankt, dafür gibt es den 'Gefällt mir' Button. Wer das nicht kann und sich selbst nicht zu helfen weiss, muss sich bezahlte Unterstützung suchen.

  • Wenn Contact Form 7 $_GET Variablen unterstützt, hängst DU die Attachment ID an den Link zum Formular an und liest die $_GET Variable im dafür vorgesehenen Feld wieder aus (Formidable Pro könnte das).

    Danke. Mit diesem zusätzlichen Plugin müsste das anscheinend seitens Contact Form 7 prinzipiell möglich sein, soweit ich das richtig verstanden habe.

    Aber wie genau hänge ich jetzt die Attachement ID an den Link zum Formular an?

    Wäre es auch möglich anstelle der ID die Bild-URL ans Formular weiterzugeben?

  • Die Attachment ID sollte ja bereits an die Lightbox übergeben werden. Dazu müsste ich den Code sehen. Die URL bekommst Du quasi auf die gleiche weise. Ich persönlich vermeide URLs in Argumenten soweit wie möglich, weil man zusätzlich Aufwand mit dem escapen hat. Man kann aber auch die ID über die Bild URL bekommen:

    Pippin macht es vor: https://pippinsplugins.com/retrieve-attac…from-image-url/

    WordPress ist "frei" wie in Freiheit es zu nutzen, aber nicht im Sinne von Freibier. Wer also glaubt man bekommt rund um WordPress alles kostenlos, der irrt. Hilfe ist ein Geschenk für das man sich bedankt, dafür gibt es den 'Gefällt mir' Button. Wer das nicht kann und sich selbst nicht zu helfen weiss, muss sich bezahlte Unterstützung suchen.

  • Ich hoffe, das ist der "richtige" Schnipsel Quellcode des Lightbox-Plugins - Teil1 [COLOR=#444444][FONT=Open Sans](wp-jquery-lightbox/jquery.lightbox.min.js)[/FONT][/COLOR]:

    PHP
    (function(a){function b(f,c){var g,e,h;f=f.split(".");c=c.split(".");e=Math.min(f.length,c.length);for(g=0;g<e;g++){h=parseInt(f[g],10)-parseInt(c[g],10);if(h!==0){return h}}return f.length-c.length}a.fn.lightbox=function(l){var w=a.extend({},a.fn.lightbox.defaults,l);if(a("#overlay").is(":visible")){a(window).trigger("resize")}function r(){f();q(this);return false}if(b(a.fn.jquery,"1.7")>0){return a(this).on("click",r)}else{return a(this).live("click",r)}function f(){a(window).bind("orientationchange",s);a(window).bind("resize",s);a("#overlay").remove();a("#lightbox").remove();w.isIE8=x();w.inprogress=false;w.auto=-1;var C=w.strings;var B='<div id="outerImageContainer"><div id="imageContainer"><iframe id="lightboxIframe" /><img id="lightboxImage"><div id="hoverNav"><a href="javascript://" title="'+C.prevLinkTitle+'" id="prevLink"></a><a href="javascript://" id="nextLink" title="'+C.nextLinkTitle+'"></a></div><div id="jqlb_loading"><a href="javascript://" id="loadingLink"><div id="jqlb_spinner"></div></a></div></div></div>';var E='<div id="imageDataContainer" class="clearfix"><div id="imageData"><div id="imageDetails"><span id="caption" ></span> </br> <span id="numberDisplay"></span> <a href="http://www.lukas-gawenda.de/fineartprint-shop/" title="Bildanfrage" target="_blank">&nbsp;&nbsp;&nbsp;&nbsp;» Abzug / Lizenz kaufen | Bildanfrage</a></div><div id="bottomNav">';if(w.displayHelp){E+='<span id="helpDisplay">'+C.help+"</span>"}E+='<a href="javascript://" id="bottomNavClose" title="'+C.closeTitle+'"><div id="jqlb_closelabel"></div></a></div></div></div>';var D;if(w.navbarOnTop){D='<div id="overlay"></div><div id="lightbox">'+E+B+"</div>";a("body").append(D);a("#imageDataContainer").addClass("ontop")}else{D='<div id="overlay"></div><div id="lightbox">'+B+E+"</div>";a("body").append(D)}a("#overlay").click(function(){k()}).hide();a("#lightbox").click(function(){k()}).hide();a("#loadingLink").click(function(){k();return false});a("#bottomNavClose").click(function(){k();return false});a("#outerImageContainer").width(w.widthCurrent).height(w.heightCurrent);a("#imageDataContainer").width(w.widthCurrent);if(!w.imageClickClose){a("#lightboxImage").click(function(){return false});a("#hoverNav").click(function(){return false})}}function s(B){if(w.resizeTimeout){clearTimeout(w.resizeTimeout);w.resizeTimeout=false}w.resizeTimeout=setTimeout(function(){A()},50)}function z(){var C=a(document).height();if(w.isIE8&&C>4096){C=4096}var B=a(window).height()-w.adminBarHeight;return new Array(a(document).width(),C,a(window).width(),B,a(document).height())}function x(){var C=false;if(document.createElement){var B=document.createElement("div");if(B&&B.querySelectorAll){B.innerHTML='<object><param name=""></object>';C=B.querySelectorAll("param").length!=1}B=null}return C}function h(){var C=0;var B=0;if(self.pageYOffset){B=self.pageYOffset;C=self.pageXOffset}else{if(document.documentElement&&document.documentElement.scrollTop){B=document.documentElement.scrollTop;C=document.documentElement.scrollLeft}else{if(document.body)
  • ... Teil 2 [COLOR=#444444][FONT=Open Sans](wp-jquery-lightbox/jquery.lightbox.min.js)[/FONT][/COLOR]:

    PHP
    {B=document.body.scrollTop;C=document.body.scrollLeft}}}if(w.adminBarHeight&&parseInt(a("#wpadminbar").css("top"),10)===0){B+=w.adminBarHeight}return new Array(C,B)}function q(G){var F=z();var C=h();var D=0;a("#overlay").hide().css({width:F[0]+"px",height:F[1]+"px",opacity:w.overlayOpacity}).fadeIn(400);if(w.isIE8&&F[1]==4096){if(C[1]>=1000){D=C[1]-1000;if((F[4]-(C[1]+3096))<0){D-=(C[1]+3096)-F[4]}a("#overlay").css({top:D+"px"})}}var E=0;var B=[];w.downloads={};a("a").each(function(){if(!this.href||(this.rel!=G.rel)){return}var L="";var I="";var N="";var H=a(this);var K=H.children("img:first-child");if(this.title){L=this.title}else{if(K.attr("title")){L=K.attr("title")}else{if(K.attr("alt")){L=K.attr("alt")}}}if(H.parent().next(".gallery-caption").html()){var M=H.parent().next(".gallery-caption");I=M.html();N=M.text()}else{if(H.next(".wp-caption-text").html()){I=H.next(".wp-caption-text").html();N=H.next(".wp-caption-text").text()}}L=a.trim(L);N=a.trim(N).replace("’","'").replace("’","'");if(L.toLowerCase()==N.toLowerCase()){L=I;I=""}var J="";if(L!=""){J='<span id="titleText">'+L+"</span>"}if(I!=""){if(L!=""){J+="<br />"}J+='<span id="captionText">'+I+"</span>"}if(w.displayDownloadLink||H.attr("data-download")){w.downloads[B.length]=H.attr("data-download")}B.push(new Array(this.href,w.displayTitle?J:"",B.length))});if(B.length>1){for(i=0;i<B.length;i++){for(j=B.length-1;j>i;j--){if(B[i][0]==B[j][0]){B.splice(j,1)}}}while(B[E][0]!=G.href){E++}}w.imageArray=B;n(C[1],C[0]).show();y(E);u()}function n(B,C){if(w.resizeSpeed>0){return a("#lightbox").animate({top:B+"px",left:C+"px"},250,"linear")}return a("#lightbox").css({top:B+"px",left:C+"px"})}function y(B){if(w.inprogress!=false){return}w.inprogress=true;w.activeImage=B;a("#jqlb_loading").show();a("#lightboxImage").hide();a("#hoverNav").hide();a("#prevLink").hide();a("#nextLink").hide();m()}function m(){w.imgPreloader=new Image();w.imgPreloader.onload=function(){a("#lightboxImage").attr("src",w.imageArray[w.activeImage][0]);A();g()};w.imgPreloader.src=w.imageArray[w.activeImage][0]}function A(){if(!w.imgPreloader){return}var E=w.imgPreloader.width;var B=w.imgPreloader.height;var G=z();var M=(G[2]<G[0])?G[0]:G[2];a("#overlay").css({width:M+"px",height:G[1]+"px"});var K=(G[3])-(a("#imageDataContainer").height()+(2*w.borderSize));var L=(G[2])-(2*w.borderSize);if(w.fitToScreen){var C=K-w.marginSize;var N=L-w.marginSize;if(a(window).width()>500){C-=w.marginSize;N-=w.marginSize}var H=1;if(B>C){H=C/B}E=E*H;B=B*H;H=1;if(E>N){H=N/E}E=Math.round(E*H);B=Math.round(B*H)}var F=h();var D=F[1]+(K*0.5);var I=D-B*0.5;var J=F[0];a("#lightboxImage").width(E).height(B);p(E,B,I,J)}function p(E,C,G,F){w.widthCurrent=a("#outerImageContainer").outerWidth();w.heightCurrent=a("#outerImageContainer").outerHeight();var B=Math.max(300,E+(w.borderSize*2));var D=(C+(w.borderSize*2));w.xScale=(B/w.widthCurrent)*100;w.yScale=(D/w.heightCurrent)*100;n(G,F);d();a("#imageDataContainer").animate({width:B},w.resizeSpeed,"linear");a("#outerImageContainer").animate({width:B,height:D},w.resizeSpeed,"linear",function(){e()});if(w.imageArray.length>1){a("#hoverNav").show();a("#prevLink").show();a("#nextLink").show()}a("#prevLink,#nextLink").height(C)}function e(){a("#imageData").show();a("#caption").show();a("#jqlb_loading").hide();if(w.resizeSpeed>0){a("#lightboxImage").fadeIn("fast",function(){o()})}else{a("#lightboxImage").show();o()}w.inprogress=false}function o(){if(w.auto!=-1){clearTimeout(w.auto);w.auto=setTimeout(function(){y((w.activeImage==(w.imageArray.length-1))?0:w.activeImage+1)},w.slidehowSpeed)}c()}function g(){if(w.imageArray.length>1){preloadNextImage=new Image();preloadNextImage.src=w.imageArray[(w.activeImage==(w.imageArray.length-1))?0:w.activeImage+1][0];preloadPrevImage=new Image();preloadPrevImage.src=w.imageArray[(w.activeImage==0)?(w.imageArray.length-1):w.activeImage-1][0]}else{if((w.imageArray.length-1)>w.activeImage){preloadNextImage=new Image();preloadNextImage.src=w.imageArray[w.activeImage+1][0]}if(w.activeImage>0){preloadPrevImage=new Image();preloadPrevImage.src=w.imageArray[w.activeImage-1][0]}}}function d(){a("#numberDisplay").html("");a("#caption").html("").hide();var C=w.imageArray;var B=w.strings;var G=w.activeImage;var F=C[G][2];if(C[G][1]&&w.showInfo){a("#caption").html(C[G][1]).show()}var H=(C.length>1&&w.showInfo)?B.image+(G+1)+B.of+C.length:"";if(w.slidehowSpeed&&C.length>1){var D=(w.auto===-1)?B.play:B.pause;H+=' <a id="playpause" href="#">'+D+"</a>"}if(w.displayDownloadLink||w.downloads[F]){var E=w.downloads[F]?w.downloads[F]:C[G][0];a("#downloadLink").show().children().attr("href",E)}else{a("#downloadLink").hide()}if(H!=""){a("#numberDisplay").html(H).show()}}function u(){if(w.imageArray.length>1){a("#prevLink").click(function(){y((w.activeImage==0)?(w.imageArray.length-1):w.activeImage-1);return false});a("#nextLink").click(function(){y((w.activeImage==(w.imageArray.length-1))?0:w.activeImage+1);return false});if(a.fn.touchwipe){a("#imageContainer").touchwipe({wipeLeft:function(){y((w.activeImage==(w.imageArray.length-1))?0:w.activeImage+1)},wipeRight:function(){y((w.activeImage==0)?(w.imageArray.length-1):w.activeImage-1)},min_move_x:20,preventDefaultEvents:true})}if(w.slidehowSpeed){a("#numberDisplay").unbind("click").click(function(){if(w.auto!=-1){a(this).children("a").text(w.strings.play);clearTimeout(w.auto);w.auto=-1}else{a(this).children("a").text(w.strings.pause);w.auto=setTimeout(function(){y((w.activeImage==(w.imageArray.length-1))?0:w.activeImage+1)},w.slidehowSpeed)}return false})}c()}}function k(){t();clearTimeout(w.auto);w.auto=-1;a("#lightbox").hide();a("#overlay").fadeOut()}function v(E){var F=E.data.opts;var B=E.keyCode;var C=27;var D=String.fromCharCode(B).toLowerCase();if((D=="x")||(D=="o")||(D=="c")||(B==C)){k()}else{if((D=="p")||(B==37)){t();y((F.activeImage==0)?(F.imageArray.length-1):F.activeImage-1)}else{if((D=="n")||(B==39)){t();y((F.activeImage==(F.imageArray.length-1))?0:F.activeImage+1)}}}return false}function c(){a(document).unbind("keydown").bind("keydown",{opts:w},v)}function t(){a(document).unbind("keydown")}};a.fn.lightbox.defaults={showInfo:false,adminBarHeight:0,overlayOpacity:0.8,borderSize:0,imageArray:new Array,activeImage:null,inprogress:false,widthCurrent:250,heightCurrent:250,xScale:1,yScale:1,displayTitle:true,imageClickClose:true,followScroll:false,isIE8:false};a(document).ready(doLightBox)})(jQuery);function doLightBox(){var a=(typeof JQLBSettings=="object");var d,b,c=0;if(a&&JQLBSettings.slideshowSpeed){d=parseInt(JQLBSettings.slideshowSpeed)}if(a&&JQLBSettings.resizeSpeed){b=parseInt(JQLBSettings.resizeSpeed)}if(a&&JQLBSettings.marginSize){c=parseInt(JQLBSettings.marginSize)}var e={help:" Browse images with your keyboard: Arrows or P(revious)/N(ext) and X/C/ESC for close.",prevLinkTitle:"previous image",nextLinkTitle:"next image",closeTitle:"close image gallery",image:"Image ",of:" of ",download:"Download",pause:"(pause slideshow)",play:"(play slideshow)"};jQuery('a[rel^="lightbox"]').lightbox({adminBarHeight:jQuery("#wpadminbar").height()||0,linkTarget:(a&&JQLBSettings.linkTarget.length)?JQLBSettings.linkTarget:"_self",showInfo:(a&&JQLBSettings.showInfo=="0")?false:true,displayHelp:(a&&JQLBSettings.help.length)?true:false,marginSize:(a&&c)?c:0,fitToScreen:(a&&JQLBSettings.fitToScreen=="1")?true:false,resizeSpeed:(a&&b>=0)?b:400,slidehowSpeed:(a&&d>=0)?d:4000,displayDownloadLink:(a&&JQLBSettings.displayDownloadLink=="0")?false:true,navbarOnTop:(a&&JQLBSettings.navbarOnTop=="0")?false:true,strings:(a&&typeof JQLBSettings.help=="string")?JQLBSettings:e})};
  • Sorry aber ich fange nicht an in unformatiertem Quellcode zu suchen.

    WordPress ist "frei" wie in Freiheit es zu nutzen, aber nicht im Sinne von Freibier. Wer also glaubt man bekommt rund um WordPress alles kostenlos, der irrt. Hilfe ist ein Geschenk für das man sich bedankt, dafür gibt es den 'Gefällt mir' Button. Wer das nicht kann und sich selbst nicht zu helfen weiss, muss sich bezahlte Unterstützung suchen.

  • Nach was genau muss ich denn suchen?

    Keine Ahnung. Deswegen muss ich ja den Code lesen. Dort wo das Bild ausgegeben wird steht wahrscheinlich eine Variable. Und die muss man zurück verfolgen um zu sehen ob dort wo sie herkommt noch weitere nützlich Daten stehen, wie z.B. die ID.

    WordPress ist "frei" wie in Freiheit es zu nutzen, aber nicht im Sinne von Freibier. Wer also glaubt man bekommt rund um WordPress alles kostenlos, der irrt. Hilfe ist ein Geschenk für das man sich bedankt, dafür gibt es den 'Gefällt mir' Button. Wer das nicht kann und sich selbst nicht zu helfen weiss, muss sich bezahlte Unterstützung suchen.

  • Nein das ist ja eine CSS ID.

    WordPress ist "frei" wie in Freiheit es zu nutzen, aber nicht im Sinne von Freibier. Wer also glaubt man bekommt rund um WordPress alles kostenlos, der irrt. Hilfe ist ein Geschenk für das man sich bedankt, dafür gibt es den 'Gefällt mir' Button. Wer das nicht kann und sich selbst nicht zu helfen weiss, muss sich bezahlte Unterstützung suchen.

  • Es ist übrigens folgendes Lightbox-Plugin, welches ich in leicht modifizierter Variante verwende:

    https://wordpress.org/plugins/wp-jquery-lightbox/

    Da sollte der Quelltext noch angenehmer und unkomprimiert zu lesen sein - das Wesentliche sollte identisch mit meiner Version der Lightbox sein. Ansonsten weiß ich gerade wirklich nicht mehr weiter, ich wäre dir aber sehr, sehr dankbar, wenn du mir doch noch irgendwie bei der Lösung dieses Problems helfen könntest!

  • Ohne Umprogrammierung ist das nicht möglich. Das Script holt sich nur die URLs aus der Parent Page und zeigt die Bilder dann mittels Ajax an. Die Attachment IDs sind nicht verfügbar. Wollte man die Image URLs an das Formular übergeben müsste man die Anzeige des Links mit in die Ajax Funktion aufnehmen, damit immer die richtige URL an den Link als Parameter angehängt wird. Dann müsste man mittels einer Funktion im Formular der ID des Bildes holen. Um dort eine Funktion ausführen zu können braucht es aber ein eigene Template. So oder so ein nicht zu unterschätzender Aufwand. Aus dem Bauch raus würde ich sagen nicht unter 3 Stunden.

    WordPress ist "frei" wie in Freiheit es zu nutzen, aber nicht im Sinne von Freibier. Wer also glaubt man bekommt rund um WordPress alles kostenlos, der irrt. Hilfe ist ein Geschenk für das man sich bedankt, dafür gibt es den 'Gefällt mir' Button. Wer das nicht kann und sich selbst nicht zu helfen weiss, muss sich bezahlte Unterstützung suchen.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!