Search…

X3 Photo Gallery Support Forums

Search…
 
User avatar
ulfklose
Experienced
Topic Author
Posts: 48
Joined: 10 Dec 2019, 09:10

Is there a way to put a contact form at the bottom of a page?

30 Dec 2019, 09:52

A SEO friend of mine recommended this to me because of this CTO (call-to-action) stuff. The visitor should be able to get in touch immediately after viewing the photos.

I tried it but always ended up with a contact form ABOVE the image gallery. Can I somehow reverse that? I still want to be able to put text above the gallery.
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is there a way to put a contact form at the bottom of a page?

31 Dec 2019, 00:00

I guess there is room for more global input fields "before" and "after" content for all the X3 modules (including gallery). For now, you would have to add it with javascript:

Paste this into Settings > Footer. Feel free to adjust the form:
Code
<form data-abide id="clone-form" class="contactform clone-form" style="display: none">
 <div>
<input type="text" name="name" placeholder="Name" required>
</div>
<div>
<input type="email" name="email" placeholder="Email" required>
</div>
<div>
<textarea rows="6" name="message" placeholder="Message" required></textarea>
</div>
<button type="submit">Send</button>
</form>
Paste this in Custom > Javascript. It clones the form and places it under the gallery for all pages that have a gallery:
Code
function x3_load_page(){
  var gallery = document.getElementsByClassName('gallery')[0];
  if(gallery){
    var form = document.getElementById('clone-form').cloneNode(true);
    form.style.display = 'block';
    gallery.parentNode.appendChild(form);
  }
}
Add some CSS to style the cloned form, making sure it's not too wide, has space and is centered. You can customize of course:
Code
.clone-form {
  max-width: 500px;
  margin: 0 auto 60px;
}
This solution is not tested for all circumstances. It will display under ALL galleries, including if you are using slideshow intro or have the gallery places above context. This is after all how it would work if there was a setting to add content before/after the gallery module.
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is there a way to put a contact form at the bottom of a page?

31 Dec 2019, 00:10

If you want instant call to action, perhaps you should consider the Chatra chat plugin for X3? You can connect it to your Facebook page, and there is a mobile app so you can receive chat requests directly on your phone.
 
User avatar
ulfklose
Experienced
Topic Author
Posts: 48
Joined: 10 Dec 2019, 09:10

Re: Is there a way to put a contact form at the bottom of a page?

31 Dec 2019, 04:38

mjau-mjau wrote: If you want instant call to action, perhaps you should consider the Chatra chat plugin for X3? You can connect it to your Facebook page, and there is a mobile app so you can receive chat requests directly on your phone.
I did, just yesterday :-). And it rocks, really, I love it.

I'll ask my SEO buddy what would be best in his opinion. I'll leave it with Chatra for now and wait for his response. 

Thank you, as always, for your excellent support. It's really the first time that the tech support really feels like one. I was discussing with the SmugMug support the other day and I was falling into despair. Thank you so much for this experience. 
 
User avatar
ulfklose
Experienced
Topic Author
Posts: 48
Joined: 10 Dec 2019, 09:10

Re: Is there a way to put a contact form at the bottom of a page?

10 Jan 2020, 12:59

Works like a charm that way, thank you.
 
User avatar
ulfklose
Experienced
Topic Author
Posts: 48
Joined: 10 Dec 2019, 09:10

Re: Is there a way to put a contact form at the bottom of a page?

16 Jan 2020, 08:00

I just had a look at Chrome's error console and noticed that there are some warnings regarding the implementation of the contact form. Will that become an issue for my site?

Besides, there are some errors on the site as well regarding the CORS policy. I researched that topic and it seems as if I had to solve this by changing something in the .htaccess file.
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is there a way to put a contact form at the bottom of a page?

16 Jan 2020, 10:04

ulfklose wrote: I just had a look at Chrome's error console and noticed that there are some warnings regarding the implementation of the contact form. Will that become an issue for my site?
Where do I see the error specific to the contact form? Probably related to several javascripts not being loaded anyway:

I see lots of errors on your website in the console, some at least related to Osano plugin. The other errors could very well be related to cookieconsent also ... Seems it might be blocking requests to external javascripts (hosted on jsDelivr CDN) perhaps to block some cookies that might occur? This is the response you have from SEVERAL external javascripts loaded on demand:
Access to XMLHttpRequest at 'https://cdn.jsdelivr.net/npm/autosize@4 ... ize.min.js' from origin 'https://www.ulfklose.wedding' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
This is either the Osano cookieconsent plugin, or some very specific settings you have on server (htaccess).
 
User avatar
ulfklose
Experienced
Topic Author
Posts: 48
Joined: 10 Dec 2019, 09:10

Re: Is there a way to put a contact form at the bottom of a page?

16 Jan 2020, 10:19

I temporarily disabled the Osano plugin, the errors disappeared, as you said. I will talk to them about that.

The warnings on the other hand remain. This happens on every gallery page. 
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is there a way to put a contact form at the bottom of a page?

16 Jan 2020, 10:28

While testing, the Osano plugin was off, but now it's on again, and this is the only thing I can see that is making errors.
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is there a way to put a contact form at the bottom of a page?

16 Jan 2020, 10:29

There is a cookie-related warning, but that is from Google analytics or some other JS. Looks harmless, and if you want to figure out exactly what it is, we would have to narrow it down a bit. X3 itself does not set cookies.
A cookie associated with a resource at http://ulfklose.wedding/ was set with `SameSite=None` but without `Secure`. A future release of Chrome will only deliver cookies marked `SameSite=None` if they are also marked `Secure`. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5633521622188032.
 
User avatar
ulfklose
Experienced
Topic Author
Posts: 48
Joined: 10 Dec 2019, 09:10

Re: Is there a way to put a contact form at the bottom of a page?

16 Jan 2020, 10:52

Here are the error messages I'm seeing:

(index):1 [DOM] Found 2 elements with non-unique id #clone-form: (More info: https://goo.gl/9p2vKq) <form data-abide id="clone-form" class="contactform clone-form" style="display: none" novalidate="novalidate">…</form> <form data-abide id="clone-form" class="contactform clone-form" style="display: block;" novalidate="novalidate">…</form>
(index):1 [DOM] Found 2 elements with non-unique id #consent: (More info: https://goo.gl/9p2vKq) <input type="checkbox" id="consent" name="consent" required> <input type="checkbox" id="consent" name="consent" required>

What's even worse: the contact form doesn't work. I tried sending it three times: before reporting the error to Osana, after disabling the Osana code completely and then after Osana pushed a fix (so the errors became warnings). The page reloads but there's no mail in my inbox. I just tested sending an email to the chosen email address, the issue isn't there and there's also nothing in my spam folder. 

The contact form on the dedicated contact page works just fine.
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is there a way to put a contact form at the bottom of a page?

16 Jan 2020, 11:33

It would help a lot if you give me the link to the page where you get the error.  How am I supposed to know what page you are referring to? Keep in mind this is a custom javascript fix to move an element, not part of default X3, so at least I need to check it before I can say what's wrong.
 
User avatar
ulfklose
Experienced
Topic Author
Posts: 48
Joined: 10 Dec 2019, 09:10

Re: Is there a way to put a contact form at the bottom of a page?

16 Jan 2020, 12:33

Sorry, my bad, it's www.ulfklose.wedding. Every gallery page, e.g. this one https://www.ulfklose.wedding/hochzeiten ... enbuettel/ has this problem. 
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is there a way to put a contact form at the bottom of a page?

16 Jan 2020, 21:46

Right. The reason I was confused about the page, is because I can't see the [DOM] error you are reporting anywhere. Also, it looks like a "warning" and not an "error"? This message is just because you seem to have two contact forms on the same page, which use the same ID, and ID's in HTML are supposed to be unique. I can't see where this is happening, and even if it is, it should be harmless and not related to the reason why the contact form is not working.

As for why the contact form is not working, is because X3's contactform javascript is not applying for your <form> after it's moved outside "content" and into "gallery". I guess I did not think about that when I offered the javascript hack. It should be possible to fix by applying the contactform JS after the form is moved ... See the new line with applyContactForm() at the end of the code provided earlier in this post:
Code
function x3_load_page(){
  var gallery = document.getElementsByClassName('gallery')[0];
  if(gallery){
    var form = document.getElementById('clone-form').cloneNode(true);
    form.style.display = 'block';
    gallery.parentNode.appendChild(form);
    gallery.parentNode.applyContactForm(true);
  }
}
 
User avatar
ulfklose
Experienced
Topic Author
Posts: 48
Joined: 10 Dec 2019, 09:10

Re: Is there a way to put a contact form at the bottom of a page?

17 Jan 2020, 03:59

Yes, you're right, it's only a warning. Sorry for that. I just suspected that this might be the cause for the contact form not working.

I added the line from your last post, unfortunately it throws the following error:

Code
(index):43 Uncaught TypeError: gallery.parentNode.applyContactForm is not a function
    at x3_load_page ((index):43)
    at sa (x3.min.js:3)
    at imagevue (x3.min.js:3)
    at imagevue_ ((index):7)
    at HTMLScriptElement.onload ((index):45)
x3_load_page @ (index):43
sa @ x3.min.js:3
imagevue @ x3.min.js:3
imagevue_ @ (index):7
onload @ (index):45
I had to remove it because the other JavaScript stuff stopped working as well because of this error, as it seems.