I use fancybox plugin to show images in lightbox. Fancybox can handle iframes. But to make this possible you should change plugin code in wp-content/plugins/colio/colio-item.php

Hmm, but Fancybox does not have categorizing feature. Its just for images one by one, right? I need something like that: http://esites.pro/escolher-site/

Not sure about “categorizing feature”, but I see that in your example lightbox plugin opens an iframe also.

Thanks! Make sure that you have selected these filters for Colio -> Items. They won’t snow on their own, only if they are assigned to items.

Hi!

The problem is in this style http://illustrationanddesign.uk/wp-content/themes/bootstrap-basic/library/css/global.css

There is such style that sets height of HTML element to 100%

font-size: 62.5%; list-style-type: none; height: 100%; overflow: hidden;

what breaks possibility to scroll with my plugin. If I set

height: auto;

everything works again. You can add next style to wp-content/plugins/colio/grid.css to fix the problem

html { height: auto!important; }

Hi! What do you mean saying that height is not ok? What height it shield be?

Colio items can’t be shared on their own. To share some item you should go to your portfolio page , like http://domain.com/portfolio/ and click “View Project” to open item details. Then copy URL from address bar that will contain a hash, like this http://domain.com/portfolio/#some-hash

This URL you can share via Facebook.

Thanks for getting back to me, much appreciated.

Working Is it possible with an API method to have two different colio lists on the same page and open items on the second list? Because now only items on the first one that’s possible to link to.

You can just define two functions, like so

window.openColio1 = function(n){
  var api = jQuery('#my_portfolio_1 .colio-list').data('colio'); 
   api.expand(n); 
}
window.openColio2 = function(n){
  var api = jQuery('#my_portfolio_2 .colio-list').data('colio'); 
   api.expand(n); 
}

where #my_portfolio_1 #my_portfolio_2 are IDs of your portfolios.

Working good! Thank you so much

Its not the filter that is having the problem. It is the items that are filtered that are having the problem. The hiding process currently is WRONG , than the process mentioned using isotope.

The current method is taking account of all the items in the list inspite of hiding them. That is the main issue. Though the items shown is only 6 for the last category, but the items calculated is 28, which is totally wrong. Please review here yourself http://www.hdl.co.nz/ [ip address 104.152.108.12]

Please rectify this error.

Thanks

Hmm. I will check this and update you shortly.

I see that there is physically 28 items in UL list. While only 21 have “show-all” filter tag and you don’t have default “X” filter to show all items. So I recommend you to make sure that all items under certain filter category have corresponding tag assigned. Also item won’t even display when it does not have featured image set in Admin.

The issue occurs after filtering using the tags at the top of the page.

e.g. click on Commercial. Then click on view project for any item in first row.

Actually it is not just the first row. If you click any project after filtering the project, it is shown at the top of the page overlapping the header.

When you click on Show All, the proper behaviour returns.

Just checked and I see you have set “after” viewport placement.

Answered. Please use appropriate thread if you are not using Colio Wordpress plugin. Comments for Colio jQuery plugin are here – https://codecanyon.net/item/colio-jquery-portfolio-content-expander-plugin/6507310/comments

Yes, I understand your concern. But I’m not sure if you can make it responsive in current plugin implementation.

The reason is that in :inside placement, viewport (items details) is inserted into the grid using “position: absolute” with inline style that contains top/left position and width/height in pixels. These params are calculated based on UL list width, vertical spacing between items and certain row in grid.

Now, when you resize window everything changes and viewport needs to be updated – (top/left as well as its dimensions should be recalculated). That’s why I decided that in :inside placement viewport should close automatically and then manually reopened.

On the other hand in :before or :after placement, viewport is static and has width: 100% to it can resize along with the page.

Thanks for the answer, I totally understand you! But what if only listen on with resize whereas ignoring height resize?

I don’t think that it’s possible. There is too many factors

Like I mentioned I don’t use WP

You are asking questions in comments to “Colio – Responsive Portfolio Wordpress Plugin”. Please use appropriate thread.

Do you use isotope or quicksand for filtering?

Hi!

- Can it open in a modal vs on the page?

Do you mean you want to open item details in modal window?

- Can I add additional fields per item? Right now I see Title, Subtitle and Description, but I would also like to add “medium”, “price” and perhaps some other information as a custom field.

you can use ACF plugin for example and then insert any custom filets you’d create for Colio Item post type using my plugin action hooks. See their list here – http://plugins.gravitysign.com/colio-wp/wp-content/plugins/colio/docs/#s6

- Can an item belong to multiple categories?

If you mean filters menu, then yes. You can assign any number of “filter tags” to colio items.

- Can there be two filters types.. for example by medium and by artist?

No, only one level of filters is available.

- Is each item a post so I can have category and tags?

Yes, every items is a custom post type. It can have filter tags (for filters menu) and a category for grouping items into multiple portfolios on website.

You should check plugin version in Wordpress Admin. Go to Plugins and find Colio in list of installed plugins. Just underneath description there is Version nn.nn.nn

Not using WP

Pagination is no available in Colio (jQuery version)

Sure. What you need is in “Advanced Usage” section of plugin documentation. You should use hooks to insert HTML for social sharing into the items details box. For example

<?php 
    function colio_add_custom_social($post) {    
        echo "<div class="social">….</div>";
                // also you can use $post object
               // to get all Post related info also
    }
    add_action('colio_item_after_main_content', 'colio_add_custom_social');
?>

this should be added to the wp-content/plugins/colio.php

Regarding JS code. You can add it right after HTML in function above , wrapped into

<script type="text/javascript"></script>

or you can do it more property by adding it into wp-content/plugins/colio/init.js file in function that starts with this

/** 
                            All 3rd-party plugins should be inside external_plugins() 
                            function. Keyword "this" refers to the content in viewport 
                            and should be used as context for selectors 
                        */

                        function external_plugins(){

….

}

and target your social DIV with this code

$('.social', this).init_social(); // or other code

Hello and sorry for delay!

I have similar functionality with 3 items & pagination, but it does not auto-advance on last item – http://plugins.gravitysign.com/colio-wp/one-row/#

If you are interested in “auto-advanvce” feature I can do this as custom work. I can write JS code that will split all items in grid into sets (by 3 for example) and then switch sets as you click next /prev buttons. Contact me privately and we can discuss a price.

Hi! I can see first thumb is highlighted. Have you resolved this problem?

Hello!

I see you have changed content of colio-item in UL list so I found two problems:

1. every colio-item LI should have a link or other clickable element with “colio-link” class. It will work as “view project” button in my demo.

2. Ajax content that plugin will load into details viewport on this URL – http://www.picoservice.it/colio/royal-hotel-sanremo/?portfolio_id=portfolio returns not what it should. I recommend to go to Settings -> Permalinks and re-save them. This link should return HTML snippet

If something is’n clear please feel free to contact me again!

Hi @flGravity we didn’t change your plugin. May u give us further instruction to solve the issue? Thank you

Please try to fix this problem first. This URL – http://www.picoservice.it/colio/royal-hotel-sanremo/?portfolio_id=portfolio returns HTML document, where is it should return only a portion of HTML like this http://plugins.gravitysign.com/colio-wp/colio/summer-afternoon/?portfolio_id=portfolio_white

Try to re-save permalinks.

Hi! As you correctly noticed you can either have a feed with fancybox or slider. To add fancybox feature to slider you should modify colio_item_print_side() function that you can find in wp-content/plugins/colio/colio-item.php

Drop me email using my profile page and I will send you modified colio-item.php file.

I have figured out that tags are used for the filters. Just a thought for future release it would be easier to have the filters be visible to select rather than having to click the choose from most used. Thanks.

>Just a thought for future release it would be easier to have the filters be visible to select rather than having to click the choose from most used

Not sure I understand. Do you mean filter tags that you can assign to Colio item on edit page? basically you can choose any existing tag or just enter a new one