Community @ The Turning Gate

Thanks Ben,

Your a genius, thank you.  I didn't realise the search mechanism was tied to the template. 

Problem resolved thank you!

Thanks Rod,

The send button is now displaying but when I complete the form and click send an email is not sent, the form field input areas are emptied so one needs to reenter details.  It also doesn't recognise if required fields are entered so I guess I'm missing some code somewhere.

I have tried this same code in a page and not in a php file and it does the same.

<div class="the__copy">
  <div class="content clearfix">
<h1 style="color:#1a75bb;">Photographic Enquiries</h1> 
<div id="form" class="contact-form">
	<form method="post" action="https://www.overthetopimagery.com.au/Contact4">
	<p><label for="name">Name *</label><input id="name" name="name" value="" type="text"></p>
	<p><label for="email">Email *</label><input id="email" name="email" value="" type="text"></p>
	<p class="honey-pot"><label for="address">Address *</label><input id="address" name="address" value="" type="text"></p>
	<p><label for="name">Telephone</label><input id="field_8" name="field_8" value="" type="text"></p>
<p><label for="name">Location Details and Address (Property Description, Buildings, Structures, vehicles/vessels) *</label><textarea rows="2" id="field_9" name="field_9"></textarea></p>
<p><label for="name">Property Owners / Residents (Names & Contact Details if different from above) *</label><textarea rows="2" id="field_10" name="field_10"></textarea></p>
	<p><label for="name">Assignment Details (Purpose, Key points of interest, Video, Resolution) *</label><textarea rows="4" id="field_6" name="field_6"></textarea></p>
	<p class="denotes-required-fields">* denotes required fields</p>
<div class="actions"><input name="submit" value="Send" type="submit" style="display:block;"></div></form></div>	
 </div>
</div><!-- .the__copy -->

Hi guys,

If I put the html code straight into a page copy area it works and I can click on the send button and the form content are emailled out OK.  If I put that very same code into the tabbed section of a php file, the send button doesn't show.  Despite the send code being there.

The line <div class="actions"><input name="submit" value="Send" type="submit"></div></form></div> is definitely in the code.  As I said the send button doesn't appear when the code is in the tab, and a look at the page source through inspector doesn't show it, it's as if the tabs makes this line dissapear. 

Contact3 page has the code in tab1 section which is identical to that in the body copy area of Content4 page:

https://www.overthetopimagery.com.au/Contact3

Contact4 - html code is in body copy area

https://www.overthetopimagery.com.au/Contact4

Code in my test today is the following:

  <section id="content1">
<div id="form" class="contact-form">
	<form method="post" action="https://www.overthetopimagery.com.au/?page=Contact2">
<p><label for="name">Name *</label><input id="name" name="name" value="" type="text"></p>
<p><label for="email">Email *</label><input id="email" name="email" value="" type="text"></p>
<p class="honey-pot"><label for="address">Address *</label><input id="address" name="address" value="" type="text"></p>
<p><label for="name">Phone Number *</label><input id="field_12" name="field_12" value="" type="text"></p>
<p><label for="name">Location Details and Address (Property Description, Buildings, Structures, vehicles/vessels) *</label><textarea rows="2" id="field_14" name="field_14"></textarea></p>
<p><label for="name">Property Owners / Residents  (Names &amp; Contact Details if different from above) *</label><textarea rows="2" id="field_15" name="field_15"></textarea></p>
<p><label for="name">Assignment Details (Purpose, Key points of interest, Video, Resolution) *</label><textarea rows="6" id="field_16" name="field_16"></textarea></p>
<p class="denotes-required-fields">* denotes required fields</p>
<div class="actions"><input name="submit" value="Send" type="submit"></div></form></div>
  </section>

As a note, I can use a hook to place a button outside of the tab section.  This shows the send button but it loses the reference back to the form content and doesn't do anything, ie no email is sent.  click on the send botton and literally nothing happens.

Cheers

Just a thought Matthew,  Could these tabs be used to insert multiple contact foms?  So instead of a gallery insert a contact form?

I have 2 types of enquries with different contact forms.  I was just wondering if I could setup a page with 2 tabs on it with 1 contact form under each tab?

Cheers

Maybe I was premature in celebrating....it works intermittanly it would appear

If I insert it between the opening and the function ttg_gallery_bottom it doesn't error but doesn't change the slideshow height either.

  <section id="content4">
        <!-- opening the gallery tab -->

    ';
    return true;
} // END

function ttg_scripts( $style, $path ) {
    echo '
    <script>
        $(\'input:radio[id="tab4"]\').change(function(){
            if(this.checked) {
                vegasAspectRatio();
            }
        });
    </script>
    ';
} // END

function ttg_gallery_bottom( $style, $path ) {
    echo '

        <!-- closing the gallery tab -->
  </section>

Hi Matthew,

I changed "tab5"to "tab4" as tab 4 is the one with the slideshow but alas it's not working.  I'm getting an error
"Something went wrong
Unexpected error: syntax error, unexpected '>' in sokar.php on line 25
Please report error at http://community.theturninggate.net"

Line 25 is <script>            I have tried relocating the code withing the php file but it keeps returning the same error. 

If I remove the <script> & </script> I then get an error on the $.

Cheers
Ian

Hi Matthew,

Yes pym is not working too well.  Well it is on my QNAP but not well as the height is correct.  Nothing is displayed at all on the hosted site despite the pictures showing that they are slideshowing in Firefox Inspector.

Love the suggestion of using PHPlugins but I'm not sure how to go about doing that.

If I add the following code to the php file, "This is a test" shows on every page on the website.  How do I ensure it only runs on the page I want it to?   Also if I add all of the content in the tabs to the php file I would imagine that file would get rather large and cumbersome to manage'.  I would have thought it best to keep web content out of the php file.

function ttg_gallery_top( $style, $path ) {
    echo '<p style="color:red;">This is a test.</p>
    ';
    return true;
} // END

And then once it's only running on 1 page how do I only display the slidshow within 1 of the tabs?  Would love to try it as this is keeping me from promoting my site.

Cheers
Ian

Hi Matthew,

Great to hear from you!  Awesome stuff your tab code is working.  (I haven't uploaded it to my main site yet but it's working on my local instance)

I can't get content 5 displaying though with the CSS code.  The tab is there just not the content.  I added an input type and sectionid for content 5 and have tried moding the css code but still can't get content 5 to display.

I removed the #hash and replaced with a . but neither worked.

.tab5:checked ~ .content5,
#tab6:checked ~ #content6 {
    display: block;
}
I must confess CSS is all new to me so still having trouble understanding it.

In response to your query I am trying to put a gallery into the pictures tab on a product page.  My logic is I'm trying to group the product content together and I thought that tabs would be a great way to do that.  Intially I thought of creating a seperate page for each tab but that didn't seem to be a very efficient way of doing things.

On my website under Custom RPAS there are currently two product buttons in tray 1, Sokar and Reconn.  Here is the link to Sokar

http://www.overthetopimagery.com.au/Sokar

These pages have the tabbed content and I wanted to have a slideshow for each product in the tabbed content.  If there is a better way of doing this I'm all ears.  I'm currently wondering if pym.js would resolve the iframe issue I have in that it doesn't scale nicely in the page especially when used on smaller screens.

This still wouldnt resolve the returning to the previous gallery (in this case the fullscreen iframe page) so was wondering if I could insert some code into the fullscreen iframe page that would return the user to the tabbed content.

Worry is this would be a messy hack and not an efficient way of doing things.

Cheers

Interesting concept Rod.  I'll look into the reponsive grid and localisations and have a play.

Cheers.