<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>custom JS &#8211; Content Views Pro</title>
	<atom:link href="https://contentviewspro.com/documentation/tags/custom-js/feed/" rel="self" type="application/rss+xml" />
	<link>https://contentviewspro.com/documentation</link>
	<description>Most Popular Filter &#38; Grid Plugin For WordPress</description>
	<lastBuildDate>Mon, 20 Jan 2025 04:06:52 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	
	<item>
		<title>Glossary layout &#8211; hide all posts at beginning, show on click A-Z letters</title>
		<link>https://contentviewspro.com/documentation/article/glossary-list-hide-all-posts-at-beginning-show-on-click-a-to-z-letters/</link>
		
		<dc:creator><![CDATA[admin1]]></dc:creator>
		<pubDate>Fri, 06 Sep 2019 01:29:06 +0000</pubDate>
				<guid isPermaLink="false">https://docs.contentviewspro.com/?p=3729</guid>

					<description><![CDATA[By default, the Glossary list show the A to Z letters, and the posts grid under the letters. To hide the posts grid at beginning, and show on click a letter, please add this code to Custom JS field (the right textarea) in Content Views >> Settings page: /* Glossary list - hide all posts &#8230;<p class="read-more"> <a class="" href="https://contentviewspro.com/documentation/article/glossary-list-hide-all-posts-at-beginning-show-on-click-a-to-z-letters/"> <span class="screen-reader-text">Glossary layout &#8211; hide all posts at beginning, show on click A-Z letters</span> Read More &#187;</a></p>]]></description>
										<content:encoded><![CDATA[<p>By default, the Glossary list show the A to Z letters, and the posts grid under the letters.<br />
To hide the posts grid at beginning, and show on click a letter, please add this code to <strong>Custom JS</strong> field (the right textarea) in <a href="https://contentviewspro.com/documentation/wp-content/uploads/2018/03/Content-Views-_-Settings.png">Content Views >> Settings</a> page:</p>
<pre style="font-size:13px">
/* Glossary list - hide all posts at beginning, show on click A to Z letters */
setTimeout(function(){
var $view = $('#pt-cv-view-VIEW_ID');
$view.hide(); $('.pt-cv-gls-menu a').on('click',function(){$view.show()});
},1000);
</pre>
<p>(please replace <strong>VIEW_ID</strong> with <a href="https://contentviewspro.com/documentation/article/what-is-id-of-a-view/">ID of your View</a>)</p>
<p>Best regards,</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Live Filter &#8211; disable loading results on changing filter option, only loading on click &#8220;Submit&#8221; button</title>
		<link>https://contentviewspro.com/documentation/article/live-filter-disable-loading-results-on-changing-filter-option-only-loading-on-click-submit-button/</link>
		
		<dc:creator><![CDATA[admin1]]></dc:creator>
		<pubDate>Thu, 03 Jan 2019 03:55:05 +0000</pubDate>
				<guid isPermaLink="false">https://docs.contentviewspro.com/?p=3523</guid>

					<description><![CDATA[Live Filter helps you to show taxonomies, custom fields&#8230; as filter options, which allows your visitors to filter content in their way. By default, the results are loaded on changing a filter option (select an option from dropdown, select a checkbox, select an option&#8230;) To disable that behavior, and only loading results on click the &#8230;<p class="read-more"> <a class="" href="https://contentviewspro.com/documentation/article/live-filter-disable-loading-results-on-changing-filter-option-only-loading-on-click-submit-button/"> <span class="screen-reader-text">Live Filter &#8211; disable loading results on changing filter option, only loading on click &#8220;Submit&#8221; button</span> Read More &#187;</a></p>]]></description>
										<content:encoded><![CDATA[<p>Live Filter helps you to show taxonomies, custom fields&#8230; as filter options, which allows your visitors to filter content in their way.</p>
<p>By default, the results are loaded on changing a filter option (select an option from dropdown, select a checkbox, select an option&#8230;)</p>
<p>To disable that behavior, and only loading results on click the &#8220;Submit&#8221; button, please add this code to <strong>Custom JS</strong> field (the right textarea) in <a href="https://contentviewspro.com/documentation/wp-content/uploads/2018/03/Content-Views-_-Settings.png">Content Views >> Settings</a> page:</p>
<pre style="font-size:13px">
/*Live Filter - disable loading results on changing filter option*/
var cvp_lf_loadonsubmit=function(){$("input, select",".cvp-live-filter").each(function(){$(this).data("nosubmit",!0)})};cvp_lf_loadonsubmit(),$("body").on("pt-cv-pagination-finished",function(){cvp_lf_loadonsubmit()});
</pre>
<hr>
<p>(to show the Submit button, please check <a href="https://contentviewspro.com/documentation/article/live-filter-add-submit-reset-button/" rel="noopener" target="_blank">this document</a>)</p>
<p>Best regards,</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Live Filter – set default sort option</title>
		<link>https://contentviewspro.com/documentation/article/live-filter-set-default-sort-option/</link>
		
		<dc:creator><![CDATA[admin1]]></dc:creator>
		<pubDate>Fri, 31 Aug 2018 02:25:52 +0000</pubDate>
				<guid isPermaLink="false">https://docs.contentviewspro.com/?p=3271</guid>

					<description><![CDATA[With the Live Filter feature in Pro version, you can show sort options in frontend, to help your users to sort content themselves. To set the default sort option, please add this code to Custom JS field (the right textarea) in Content Views >> Settings page: /*Live Filter – set default sort option*/ if (!window.location.search) &#8230;<p class="read-more"> <a class="" href="https://contentviewspro.com/documentation/article/live-filter-set-default-sort-option/"> <span class="screen-reader-text">Live Filter – set default sort option</span> Read More &#187;</a></p>]]></description>
										<content:encoded><![CDATA[<p>With the Live Filter feature in Pro version, you can show sort options in frontend, to help your users to sort content themselves.<br />
To set the default sort option, please add this code to <strong>Custom JS</strong> field (the right textarea) in <a href="https://contentviewspro.com/documentation/wp-content/uploads/2018/03/Content-Views-_-Settings.png">Content Views >> Settings</a> page:</p>
<pre style="font-size:13px">
/*Live Filter – set default sort option*/
if (!window.location.search) {
    var viewid = 'VIEW_ID', default_sort = 'SORT_VALUE';
    if ($('[data-sid="' + viewid + '"] [name="_orderby"]').val() == '') {
        $('[data-sid="' + viewid + '"] [name="_orderby"]').val(default_sort).trigger('change');
    }
}
</pre>
<p>then:</p>
<ul>
<li>replace <strong>VIEW_ID</strong> with <a href="https://contentviewspro.com/documentation/article/what-is-id-of-a-view/">ID of your View</a></li>
<li>replace <strong>SORT_VALUE</strong> with the sort option you want to set as default, it can be <code>title</code>, <code>date</code>, or custom field key (to get correct custom field key, select that field from the live filter, the URL will change to <code>?_orderby=FIELD_KEY</code>, then copy the FIELD_KEY in URL).</li>
</ul>
<p>Best regards,</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Pagination &#8211; trigger custom Javascript action after clicking a page number</title>
		<link>https://contentviewspro.com/documentation/article/pagination-trigger-custom-javascript-action-clicking-pagination-number/</link>
		
		<dc:creator><![CDATA[admin1]]></dc:creator>
		<pubDate>Wed, 11 Apr 2018 05:18:15 +0000</pubDate>
				<guid isPermaLink="false">https://docs.contentviewspro.com/?p=3033</guid>

					<description><![CDATA[Content Views and Content Views Pro helps you to show posts, pages, etc. with pagination easily. To trigger custom Javascript action after clicking a pagination number, please use this Javascript code: /*Pagination – trigger custom Javascript action after clicking*/ $('body').on('pt-cv-pagination-finished pt-cv-pagination-finished-simple', function(e, pages_holder, $loaded_content) { // add your JS code here }); It works with &#8230;<p class="read-more"> <a class="" href="https://contentviewspro.com/documentation/article/pagination-trigger-custom-javascript-action-clicking-pagination-number/"> <span class="screen-reader-text">Pagination &#8211; trigger custom Javascript action after clicking a page number</span> Read More &#187;</a></p>]]></description>
										<content:encoded><![CDATA[<p>Content Views and Content Views Pro helps you to show posts, pages, etc. with pagination easily.</p>
<p>To trigger custom Javascript action after clicking a pagination number, please use this Javascript code:</p>
<pre style="font-size:13px">
/*Pagination – trigger custom Javascript action after clicking*/
$('body').on('pt-cv-pagination-finished pt-cv-pagination-finished-simple', function(e, pages_holder, $loaded_content) {
    // add your JS code here
});
</pre>
<p>It works with Ajax load-more and infinite scrolling pagination too. Your event will be triggered after the new page finishes loading.</p>
<p>Best regards,</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Live Filter – hide all posts at the beginning</title>
		<link>https://contentviewspro.com/documentation/article/live-filter-hide-posts-beginning/</link>
		
		<dc:creator><![CDATA[CVP]]></dc:creator>
		<pubDate>Wed, 28 Feb 2018 03:16:11 +0000</pubDate>
				<guid isPermaLink="false">https://docs.contentviewspro.com/?p=2885</guid>

					<description><![CDATA[By default, posts will be visible under filters list of Live Filter. To hide these posts at page load, Please add this code to Custom JS field in Content Views &#62;&#62; Settings page: /* Live Filter – Hide results at beginning */ var view_id="VIEW_ID",$view=$("#pt-cv-view-"+view_id),$pagination=$(".pt-cv-pagination-wrapper [data-sid="+view_id+"]").parent();new RegExp($(".cvp-live-filter").map(function(){return $(this).data("name")}).get().join("&#124;")).test(window.location.search)&#124;&#124;($view.hide(),$pagination.hide()); Please replace VIEW_ID with ID of your View. &#8230;<p class="read-more"> <a class="" href="https://contentviewspro.com/documentation/article/live-filter-hide-posts-beginning/"> <span class="screen-reader-text">Live Filter – hide all posts at the beginning</span> Read More &#187;</a></p>]]></description>
										<content:encoded><![CDATA[<p>By default, posts will be visible under filters list of Live Filter.<br />
To hide these posts at page load, Please add this code to Custom JS field in Content Views &gt;&gt; Settings page:</p>
<pre style="font-size: 13px;">/* Live Filter – Hide results at beginning */
var view_id="<strong>VIEW_ID</strong>",$view=$("#pt-cv-view-"+view_id),$pagination=$(".pt-cv-pagination-wrapper [data-sid="+view_id+"]").parent();new RegExp($(".cvp-live-filter").map(function(){return $(this).data("name")}).get().join("|")).test(window.location.search)||($view.hide(),$pagination.hide());
</pre>
<p>Please replace <strong>VIEW_ID</strong> with <a href="https://contentviewspro.com/documentation/article/what-is-id-of-a-view/">ID of your View</a>. Also, ensure there is NO space between quotes.</p>
<p>Best regards,</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Scrollable list &#8211; fade effect (instead of slide)</title>
		<link>https://contentviewspro.com/documentation/article/scrollable-list-fade-effect-instead-slide/</link>
		
		<dc:creator><![CDATA[CVP]]></dc:creator>
		<pubDate>Thu, 18 Jan 2018 02:10:00 +0000</pubDate>
				<guid isPermaLink="false">https://docs.contentviewspro.com/?p=2792</guid>

					<description><![CDATA[By default, the Scrollable list uses the slide effect when switching slides. To use the fade effect, please add this code to Custom CSS field in Content Views >> Settings page: /* Scrollable list – fade effect */ .pt-cv-carousel .item{transition:opacity ease-in-out .5s!important}.pt-cv-carousel .active.left,.pt-cv-carousel .active.right,.pt-cv-carousel .item{opacity:0!important}.pt-cv-carousel .active,.pt-cv-carousel .next.left,.pt-cv-carousel .prev.right{opacity:1!important}.pt-cv-carousel .active.left,.pt-cv-carousel .active.right,.pt-cv-carousel .next,.pt-cv-carousel .prev{transform:translate3d(0,0,0)!important} Best regards,]]></description>
										<content:encoded><![CDATA[<p>By default, the Scrollable list uses the slide effect when switching slides.<br />
To use the fade effect, please add this code to <strong>Custom CSS</strong> field in Content Views >> Settings page:</p>
<pre style="font-size:13px">
/* Scrollable list – fade effect */
.pt-cv-carousel .item{transition:opacity ease-in-out .5s!important}.pt-cv-carousel .active.left,.pt-cv-carousel .active.right,.pt-cv-carousel .item{opacity:0!important}.pt-cv-carousel .active,.pt-cv-carousel .next.left,.pt-cv-carousel .prev.right{opacity:1!important}.pt-cv-carousel .active.left,.pt-cv-carousel .active.right,.pt-cv-carousel .next,.pt-cv-carousel .prev{transform:translate3d(0,0,0)!important}
</pre>
<p>Best regards,</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Live Filter &#8211; show Submit, Reset button</title>
		<link>https://contentviewspro.com/documentation/article/live-filter-add-submit-reset-button/</link>
		
		<dc:creator><![CDATA[CVP]]></dc:creator>
		<pubDate>Mon, 23 Oct 2017 11:04:07 +0000</pubDate>
				<guid isPermaLink="false">http://docs.contentviewspro.com/?p=2472</guid>

					<description><![CDATA[Please add this code to Custom JS field in Content Views >> Settings page: /* Live Filter - add the Submit, Reset button */ window.cvp_lf_submit_reset = true; Best regards,]]></description>
										<content:encoded><![CDATA[<p>Please add this code to <strong>Custom JS</strong> field in Content Views >> Settings page:</p>
<pre style="font-size:13px">
/* Live Filter - add the Submit, Reset button */
window.cvp_lf_submit_reset = true;
</pre>
<p>Best regards,</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Live Filter &#8211; force to reload/refresh on changing filter</title>
		<link>https://contentviewspro.com/documentation/article/live-filter-shortcode-is-visible-in-filter-result/</link>
		
		<dc:creator><![CDATA[CVP]]></dc:creator>
		<pubDate>Wed, 11 Oct 2017 03:05:41 +0000</pubDate>
				<guid isPermaLink="false">http://docs.contentviewspro.com/?p=2322</guid>

					<description><![CDATA[By default, the Live filter uses AJAX technique to load filter results. It means the page doesn’t reload, and an asynchronous request is sent to the webserver to retrieve the result. If the shortcodes of the theme or another plugin are visible in the retrieved result, the reason is these shortcodes are not available (and &#8230;<p class="read-more"> <a class="" href="https://contentviewspro.com/documentation/article/live-filter-shortcode-is-visible-in-filter-result/"> <span class="screen-reader-text">Live Filter &#8211; force to reload/refresh on changing filter</span> Read More &#187;</a></p>]]></description>
										<content:encoded><![CDATA[<p>By default, the Live filter uses AJAX technique to load filter results. It means the page doesn’t reload, and an asynchronous request is sent to the webserver to retrieve the result.<br />
If the shortcodes of the theme or another plugin are visible in the retrieved result, the reason is these shortcodes are not available (and not executable) in the AJAX request.</p>
<p>To resolve this issue, please add this code to <strong>Custom JS</strong> field in Content Views &gt;&gt; Settings page:</p>
<pre style="font-size: 13px;">/* Live Filter force to reload page */
window.cvp_lf_reload_url = true;
</pre>
<p>The page will reload, and shortcodes will be available and executable in the results.</p>
<h3 id="scrollback">Extra:</h3>
<p>If you want to <strong>scroll back to the same position after reload</strong>, please add this code to <strong>Custom JS</strong> field in Content Views &gt;&gt; Settings page:</p>
<pre style="font-size: 13px;">
/* Live Filter - scroll back to the same section after reload */
$("input, select",".cvp-live-filter").on("change",function(){setTimeout(function(t){(window.cvp_lf_reload_url||0===t.closest(".pt-cv-wrapper").find(".pt-cv-view").length)&&sessionStorage.setItem("cvp_offsettop_"+t.closest(".cvp-live-filter").data("sid"),$(this).scrollTop())},100,$(this))}),$(function(){if($("input, select",".cvp-live-filter").length>0){var t=$("input, select",".cvp-live-filter").first().closest(".cvp-live-filter").data("sid"),e=sessionStorage.getItem("cvp_offsettop_"+t);e&&$("html, body").animate({scrollTop:e},500),e&&sessionStorage.removeItem("cvp_offsettop_"+t)}});
</pre>
<p>Best regards,</p>
]]></content:encoded>
					
		
		
			</item>
	</channel>
</rss>
