Unfortunately, you cannot disable the lightbox effect for posts loaded via shortcodes in the WordPress admin panel. You should perform the following steps:<\/p>\r\n
- \r\n
- \r\n
Log into your WordPress admin panel, navigate to Pages<\/strong> tab and open the page that loads posts you want to edit. <\/p>\r\n
NOTE: You can use WordPress Admin Bar to access the required page from the site frontend (see the screenshot below):<\/p>\r\n
![\"Wordpress_disable_lightbox_effect_in_shortcodes_posts1\"](\"\/help\/wp-content\/uploads\/2015\/01\/Wordpress_disable_lightbox_effect_in_shortcodes_posts1-300x168.jpg\")
<\/a>\r\n<\/li>\r\n- \r\n
In the Text area of the post editor find the shortcode that loads posts, for example, post_grid<\/strong> in our case. It will look the similar way:<\/p>\r\n
\r\n [posts_grid type="team" columns="5" rows="1" order_by="date" order="DESC" thumb_width="205" thumb_height="205" meta="no" excerpt_count="0" link="yes" link_text="view info" custom_class="profiles"]\r\n <\/pre>\r\n
In this shortcode you should find custom_class="profiles"<\/strong>. You will use the value of the custom class<\/strong> attribute in the new script:<\/p>\r\n
![\"Wordpress_disable_lightbox_effect_in_shortcodes_posts2\"](\"\/help\/wp-content\/uploads\/2015\/01\/Wordpress_disable_lightbox_effect_in_shortcodes_posts2-300x168.jpg\")
<\/a><\/p>\r\nNOTE: If you don’t have custom class<\/strong> attribute in the shortcode, add it with any value. Don’t forget to click Update<\/strong> button to save changes on the page.<\/p>\r\n<\/li>\r\n
- \r\n
Now you should add an additional script that will disable lightbox effect for this custom class. Please connect your FTP account or open File Manager and go to \/wp-content\/themes\/themeXXXXX\/js<\/strong> folder (where XXXXX is the number of your theme). You will find my_script.js<\/strong> file there. Open this file via any code editor, for example, Notepad++.<\/p>\r\n
IMPORTANT: Always make a copy of the file that you are going to edit. It will help you to revert your changes easily, if you need it.<\/p>\r\n<\/li>\r\n
- \r\n
Add the following script in the very end of the file before the closing })(jQuery)<\/strong> tag:<\/p>\r\n
\r\n jQuery(document).ready(function(){\r\n\t jQuery('.posts-grid.posts-grid-two figure a[rel*="prettyPhoto"]').attr('rel','');\r\n\t jQuery('.posts-grid.posts-grid-two figure a').click(function(e) {\r\n\t\te.preventDefault();\r\n\t });\r\n });\r\n <\/pre>\r\n<\/li>\r\n- \r\n
In this script you should change "posts-grid.posts-grid-two"<\/strong> class to your custom class from the shortcode, "profiles"<\/strong> class in our case. The edited script will look the following way:<\/p>\r\n
\t\r\n jQuery(document).ready(function(){\r\n\t\tjQuery('.profiles figure a[rel*="prettyPhoto"]').attr('rel','');\r\n\t\tjQuery('.profiles figure a').click(function(e) {\r\n\t\t\te.preventDefault();\r\n\t\t});\r\n });\r\n <\/pre>\r\n<\/li>\r\n- \r\n
Save changes in the file. Refresh the page to check changes on your site. We can see that the lightbox effect was disabled successfully.<\/p>\r\n<\/li>\r\n
- \r\n
To remove zoom style from your images you should add the following rules in the very end of the \/wp-content\/themes\/themeXXXXX\/style.css<\/strong> file:<\/p>\r\n
\r\n.profiles .zoom-icon {\r\nbackground: none!important;\r\n}\r\n\r\n.profiles .zoom-icon:before {\r\nbackground: none!important;\r\n}\r\n<\/pre>\r\nChange the class ".profiles"<\/strong> to your custom class in that CSS rules. Don’t forget to save changes in the file.<\/p>\r\n
- \r\n
![\"Wordpress_disable_lightbox_effect_in_shortcodes_posts3\"](\"\/help\/wp-content\/uploads\/2015\/01\/Wordpress_disable_lightbox_effect_in_shortcodes_posts3-300x168.jpg\")
<\/a>\r\n <\/li>\r\n<\/ol>\r\n