Manually Enqueuing Scripts
-
Hi there,
Thanks for creating this plugin – it looks and works great.
I’m trying to manually enqueue the style and script only on the page that this calendar appears using the following example: https://gist.github.com/nickyoung87/f32de613864c073028fe
I’ve unchecked the setting the on WP General Settings page and I’ve put the following before I call the header on my page template:
// Enqueue Google Calendar Events CSS. wp_enqueue_style( 'google-calendar-events-public' ); // Enqueue Google Calendar Events JS. wp_enqueue_script( 'google-calendar-events-public' );The CSS works fine however when I change month it uses the href of the wrapping
<a>tag and doesn’t change to the next month.If I remove this manual enqueuing and enable the setting in the admin panel the calendar works perfectly fine.
Any help would be greatly appreciated.
Many thanks,
Chris
-
Can you try with
function crboakes_manually_enqueuing_scripts() { wp_enqueue_style( 'google-calendar-events-public' ) ); wp_enqueue_script( 'google-calendar-events-public' ) ); } add_action( 'wp_enqueue_scripts', 'crboakes_manually_enqueuing_scripts' );if it works you could run this conditionally by checking for template page
Thanks for getting back to me Fulvio.
I’ve given that a go. I was getting an error because there’s an extra closing bracket on each of the enqueue lines. I took those out but unfortunately I’m still getting the same issue as before whereby it’s inheriting the style but none of the JS functionality seems to be working.
Thanks,
Chris
sorry, the extra parenthesis were left out by a typo
do you mind trying again with:
function crboakes_manually_enqueuing_scripts() { wp_enqueue_style( 'google-calendar-events-public' ); wp_enqueue_script( 'google-calendar-events-qtip' ); wp_enqueue_script( 'google-calendar-events-public' ); } add_action( 'wp_enqueue_scripts', 'crboakes_manually_enqueuing_scripts' );thanks
Hi Fulvio,
Thanks for your reply.
I’ve dropped that in but weirdly still getting the same issue. I’ve had a look myself to see what’s causing it – it appears as though when I uncheck ‘Enqueue this plugin’s scripts and styles on every post and page.’ it doesn’t load the styles (as it should do) but still loads these scripts:
<script type='text/javascript' src='http://localhost/test/www/wp-content/plugins/google-calendar-events/js/jquery.qtip.min.js?ver=2.2.7'></script> <script type='text/javascript' src='http://localhost/test/www/wp-content/plugins/google-calendar-events/js/gce-script.js?ver=2.2.7'></script>When I check ‘Enqueue this plugin’s scripts and styles on every post and page.’ it adds an extra script tag which it seems to need to solve the issue:
<script type='text/javascript'> /* <![CDATA[ */ var gce_grid = {"gce-1":{"target_element":"gce-1","feed_ids":"409","title_text":null,"type":"page","show_tooltips":"true"}}; var gce = {"script_debug":"","ajaxurl":"http:\/\/localhost\/test\/www\/wp-admin\/admin-ajax.php","loadingText":"Loading..."}; /* ]]> */ </script>If I manually add this to the footer and manually enqueue the styles (as above) it works. Is there a way to integrate this script into the above function?
Many thanks,
Chris
hey Chris nice catch
I will look at this – I’m more focused in a refactored version of the plugin since I joined the other two team members and it seems I might have missed the handling of that setting, which might be broken if it’s like you describe
if it’s just a matter of wrapping the wp_enqueue of those files with a settings option check it should be easy to fix – I’ll try to make a modification by tomorrow or and maybe publish a new release – or by early next week at most if we have more to add to the next release
or, if you prefer, since you seem familiar with code, feel free to issue a pull request here https://github.com/moonstonemedia/WP-Google-Calendar-Events/tree/master (the refactor branch is the one I’m working at, if you are curious to have a look)
thanks for looking into this
Hey Fulvio,
Thanks for your reply and offering to fix it. I’ll checkout your branch this weekend/Monday and see if there’s anything I can add.
Thanks again.
currently in dev branch on github there should be a fix for your problem and you’d be able to dequeue the intended scripts – might publish later
Nice work, thanks a lot – I’ll check it out!!
I’m sending an update that might solve this and you’d be able to dequeue scripts if need to – please let me know if it works out
the update is available also on wordpress.org so you might not have to fetch the version on github manually
however, I’m aware that in 2.2.9 there is a bug that appears only when using custom date range (grid) – going to push a fix later today
you can still test if it works with the dequeue you wanted
Hi Fulvio,
Thanks for your reply.
I’ve installed the update and it’s not loading the scripts on other pages where I don’t want them enqueued which is great so thanks for fixing that. It’s also not sending me to the top of the page (with a #) when I change month which it was previously doing. But unfortunately it’s still not changing month on the calendar. If I manually add:
<script type='text/javascript'> /* <![CDATA[ */ var gce_grid = {"gce-1":{"target_element":"gce-1","feed_ids":"409","title_text":null,"type":"page","show_tooltips":"true"}}; var gce = {"script_debug":"","ajaxurl":"http:\/\/localhost\/test\/www\/wp-admin\/admin-ajax.php","loadingText":"Loading..."}; /* ]]> */ </script>To the footer the month changing works again. For now I can manually enqueue this code but that’s what seems to stop it working.
Many thanks,
Chris
I see what you’re trying to do,
but the plugin changed a bit the behaviour on how it loads data for a calendar – I thought storing that data in a localized variable with wp_localize_script wasn’t efficient (and it created a problem in the way it was enqueuing scripts before) so now it’s fetching that gce_grid parameters from a data attribute straight from the calendar, in the div element where it’s printed
maybe your script uses the old javascript that looks for that variable printed in footer instead?
if you are interested in future development of this plugin you may want to have a look at this branch (not fully functional yet) https://github.com/moonstonemedia/WP-Google-Calendar-Events/tree/refactor
Ah okay, I’ve just had a look and I can see that you’re storing the gce_grid within the ‘data-feed’ tag (where it used to see within the footer script tags) right?
I can see that when I check the option ‘Always Enqueue Scripts & Styles’ it adds everything needed including:
<script type='text/javascript'> /* <![CDATA[ */ var gce = {"ajaxurl":"http:\/\/localhost\/test\/www\/wp-admin\/admin-ajax.php","loadingText":"Loading..."}; /* ]]> */ </script>However when I uncheck ‘Always Enqueue Scripts & Styles’ and manually enqueue it doesn’t include the above which it seems to rely on this for the calendar to change months.
Basically what I’m trying to achieve is this: https://gist.github.com/nickyoung87/f32de613864c073028fe
But I think enqueueing it like so:
wp_enqueue_style( 'google-calendar-events-public' ); wp_enqueue_script( 'google-calendar-events-qtip' ); wp_enqueue_script( 'google-calendar-events-public' );Doesn’t enqueue the gce line above and stops the calendar from being able to change months.
However, I could be missing something obvious? Happy to play around with the git branch – thanks for the link.
you are correct, but if you are including your own scripts, it makes sense that you include your own variables
you need to add something like:
wp_localize_script( 'your-script', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );to use admin ajax in frontend
Sure, makes sense. Thank you very much for your help.
For anyone stumbling across this thread, the final solution that I’m running with is:
function manually_enqueue_google_calendar_events() { // Enqueue Google Calendar Events CSS wp_enqueue_style( 'google-calendar-events-public' ); // Enqueue Google Calendar Events QTip wp_enqueue_script( 'google-calendar-events-qtip' ); // Enqueue Google Calendar Events JS wp_enqueue_script( 'google-calendar-events-public' ); // Use admin-ajax in the frontend wp_localize_script( 'google-calendar-events-public', 'gce', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ), 'loadingText' => __( 'Loading...', 'gce' ), ) ); } add_action( 'wp_enqueue_scripts', 'manually_enqueue_google_calendar_events' );Now marking this topic as resolved.
Chris
The topic ‘Manually Enqueuing Scripts’ is closed to new replies.