I was using prettyphoto in my WooCommerce Addon, and it was loading from WooCommerce files, but in v 3.0 WooCommerce has removed the prettyphoto and started using other scripts like
flexslider
zoom
photoswipe
I want to enqueue their these bundled scripts, but can't find a function to do that. Any help will be appreciated.
Thanks
I'm not sure I fully understand your problem, but if I do maybe this can help:
in your function.php add these lines:
add_action( 'after_setup_theme', 'photoswipe_gallery_setup' );
function photoswipe_gallery_setup() {
add_theme_support( 'wc-product-gallery-zoom' );
add_theme_support( 'wc-product-gallery-lightbox' );
add_theme_support( 'wc-product-gallery-slider' );
}
This will enable support for PhotoSwipe
You can enable/disable features deleting/commenting the correstonding line.
credits
Related
I want to create a WordPress Plugin where I want to add some css, and upon activation, those css will be in effect and be viewing in the website. Upon deactivation, the css will also be out of effect.
Any how I can do that? Or any documentation I can take help from?
You can follow Plugin Handbook for creating a plugin https://developer.wordpress.org/plugins/.
create a CSS file in plugin directory then upon plugin activation hook you can enqueue the CSS file using action 'wp_enqueue_style'.
You can add this to your main file to load your css file:
function add_my_css() {
$plugin_url = plugin_dir_url( __FILE__ );
wp_enqueue_style( 'style', $plugin_url . "/css/plugin-style.css");
}
add_action( 'wp_enqueue_scripts', 'add_my_css' );
Then create your plugin-style.css file and write your css.
Hope this helps
I am building my own wordpress theme and I have such a problem. Media library doesn't work, I can't add any image to the page. I am using the latest version of wordpress.
Files available on github https://github.com/krysba/themes-wordpress
When I turn on the standard wordpress theme, the library works :(
I am asking for help in solving this problem.
If you have not tried, the first thing that i'll tring it's enable debug mode on Wordpress from wp-config.php and check if some alerts or errors can help.
define('WP_DEBUG', true);
I think that you must try to comment all function.php and debugging it row by row.
At the first check i've found a wrong use of the function add_theme_support and in the enqeueing files.
For example the right way to user add_theme_support is on the after_setup_theme action:
function my_setup_theme(){
add_theme_support('post-formats',array('gallery','link','image','quote','status','video','audio'));
}
add_action( 'after_setup_theme', 'my_setup_theme' );
Also the right way to enqueing scripts or styles is that:
function add_theme_scripts() {
wp_enqueue_style( 'style', get_stylesheet_uri() );
}
add_action( 'wp_enqueue_scripts', 'add_theme_scripts' );
See it on this page: https://developer.wordpress.org/themes/basics/including-css-javascript/
I have a shop website with woocommerce 3.0.3 and on product detail page using default woocommerce templates, there is an issue with lightbox about clicking on the main image or gallery images. The site redirects me to a page with the image link instead of showing the lightbox.
You just need to add these lines in your function.php file and your lightbox (photoswipe) will work absolutely fine.
if(class_exists('WooCommerce')){
add_theme_support( 'wc-product-gallery-zoom' );
add_theme_support( 'wc-product-gallery-lightbox' );
add_theme_support( 'wc-product-gallery-slider' );
}
Hope this helps
I found the solution. In latest version woocommerce-3.0.3, lightbox is replaced with photosswipe. Photoswipe is disabled in my theme. It works only if the theme add support like add_theme_support('wc-product-gallery-lightbox') then it works like a charm
The problem is not only the missing add_theme_support('wc-product-gallery-lightbox')
If the DOM structure is not the same as the updated files: product-thumbnail.php and product-image.php - then the add_theme_support function won't help you.
Copy these files from WooCommerce plugin to your theme, and it should work.
I'm using wordpress 4.7 and i have a simple html that i want to implement it on wordpress twentyseventeen theme but problem is wordpress injecting multiple svg tag. so how do i remove or disable the svg,defs,symbol whole things.Though search in the web unable to find any solution
add this in your functions.php :
remove_action( 'wp_footer', 'twentyseventeen_include_svg_icons', 9999 );
Do it after theme setup:
function remove_parent_svg_icons()
{
remove_action('wp_footer', 'twentyseventeen_include_svg_icons', 9999);
}
add_action('after_setup_theme', 'remove_parent_svg_icons');
Hi I'm trying to get WP Featherlight setup as the default lightbox, right now Visual Composer is using prettyPhoto. So I need to disable it, so that WP Featherlight will overwrite it.
I asked wpbakery and I got this response.
Hello, you can actually overwrite prettyphoto by adding prettyPhoto() in your functions.php and call another lightbox.
And from the plug-in author I got this:
Once prettyPhoto has been disabled, you shouldn't need to do anything
else to lightbox images on the site.
So it's pretty clear what I need to do. Disable prettyPhoto. But I don't know how to do that. Can I add a simple line to my child theme's functions.php? Or?
Any help would really be appreciated.
Thanks.
Place the following code in your theme's function file.
function remove_vc_prettyphoto(){
wp_dequeue_script( 'prettyphoto' );
wp_deregister_script( 'prettyphoto' );
wp_dequeue_style( 'prettyphoto' );
wp_deregister_style( 'prettyphoto' );
}
add_action( 'wp_enqueue_scripts', 'remove_vc_prettyphoto', 9999 );
I have tested this on my installation and it works flawlessly.
What it does is dequeues and deregisters the javascript and stylesheets that Visual Composer enqueues and registers throughout the plugin's PHP files for the various template elements and shortcodes that use the prettyPhoto lightbox.
The '9999' parameter enforces that the dequeuing/deregistering happens well after any enqueuing or registering took place earlier on in the loading of the plugin. Any number will do, but the higher the number the better.
You have to enqueue a custom javascript in your child theme where you override the following function:
function vc_prettyPhoto() {
}
in this way you disable prettyPhoto script initialization made by Visual Composer.
You can use code bellow to disable that javascript lib. Put that into your functions.php of theme
wp_dequeue_script( 'prettyphoto' );
wp_dequeue_style( 'prettyphoto' );
Also other page buider you can use is King Composer, which is faster VC
https://wordpress.org/plugins/kingcomposer/
Not sure if you solved the problem, but I have a solution (not very elegant, but it works).
I did buy ePix theme for a photographer and noticed that Masonry Media Grid from Visual Composer isn't fully responsive. So my soulution was to edit 3 files from wp-content/assets/js/dist. Those files are:
vc_grid.min.js
page_editable.min.js
js_composer_front.min.js
Just remove window.vc_prettyPhoto() or vc_prettyPhoto() from wherever they appear.
After that I installed Lightbox by dFactor, choose swipebox and used as selector prettyPhoto. Also I did force lightbox on link images. Now the lightbox is fully-responsive.
Hopefully this will help somebody :)
You can disable Pretty Photo. Use the below code in theme's function file, thats it.
function remove_scripts(){
wp_dequeue_script('prettyphoto' );
wp_deregister_script('prettyphoto' );
}
add_action( 'wp_enqueue_scripts', 'remove_scripts', 100 );
It will work.
I have tested on my own issue to deactivate some sliders from the Visual Composer and it works. An example how to deactivate the whole Flexslider, Nivoslider and Owl Carousel sliders in the Visual Composer plugin. Add this code into theme functions.php file:
add_action( 'wp_enqueue_scripts', 'deregister_vc_modules', 99 );
function deregister_vc_modules() {
wp_deregister_style( 'flexslider' );
wp_deregister_script( 'flexslider' );
wp_deregister_style( 'nivo-slider-css' );
wp_deregister_style( 'nivo-slider-theme' );
wp_deregister_script( 'nivo-slider' );
wp_deregister_style( 'owl-carousel' );
wp_deregister_script( 'owl-carousel' );
}