[Resolved] Javascript will not load – Parsing Errors with GP

[Jessica]

I’m using ACF successfully in other areas of the site – all showing up as expected on the front and back end.

However in this new case, I am trying to trigger an accordion effect. I have created everything as usual, see the metaboxes on the page editor but upon loading the page, I get a big orange error message.

I worked with a colleague (who is using a different parent theme) and she was able to successfully get it to work.

I’m getting this error:

Parse error: syntax error, unexpected '<' in /Users/jessicarosengard/Documents/Websites/jessicarosengard-new.dev/wp-content/plugins/gp-premium/hooks/functions/hooks.php(19) : eval()'d code on line 5

Here’s my code:
added to functions.php

function wpb_adding_scripts() {
	wp_register_script('myaccordion', get_template_directory_uri() . '/assets/js/myaccordion.js', array( 'jquery' ), '1.0', true );
	  if ( is_page() ) {
	  wp_enqueue_script('myaccordion');
	  }
	}
	add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts' );

Added to the hooks area (with Execute PHP checked)

<div class="accordion">
<?php if( have_rows('new_faq') ): 
while ( have_rows('new_faq') ) : the_row();
if( get_row_layout() == 'question_answer' ):
<dt>
<a href=""><h3><?php the_sub_field('my_question'); ?></h3></a>
</dt>
<dd>
<?php the_sub_field('my_answer'); ?>
</dd>
 
<?php endif;
endwhile;
else :
// no layouts found
endif;
?></div>

Nothing is working and I’m not sure if there’s just a different way of doing this with GP. 🙁

[Tom]

Your PHP has an error in it.

if( get_row_layout() == 'question_answer' ):
<dt>

Should be:

if( get_row_layout() == 'question_answer' ): ?>
<dt>

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Jessica]

BAAH. I will try that and see if it fixes things.
(I genuinely hate using .js to do this and am looking to do a pure css method)

Thanks! I hope this works!

[Jessica]

BINGO! Thank you. Worked!

Any suggestions how to make the animation less jumpy? Each time I click an option, I do not see a smooth transition.

UGH.

[Tom]

It depends on the javascript.

Why not use a shortcode like this?: https://wordpress.org/plugins/jquery-collapse-o-matic/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Jessica]

A Shortcode plugin renders the ease-of-use for the client moot. This also ADDS another plugin which is unnecessary.

The custom fields I created allow for easy “add/edit/save” for the client, since they will be managing changing content on this page. As you can see on the attached, it’s way too much for them to have to to manually deal with shortcodes (especially for for a client/person with absolutely no knowledge of things like this work or how easily it can break the layout of a page if a bracket is misplaced or accidentally deleted).

I’d rather find a way to smooth the accordion opening/closing for the front end.

[Tom]

Ah I understand.

I don’t really have any tips for accordion javascript etc.. but I know there’s tons of tutorials out there and quite a few ways to do it. Try a few until you find one you like 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts