Grid Layout Gallery

I would like to make a custom grid layout and gallery
functions: thumbnails images, hover over zoom out effect.
Text below image, small description
Arrows on top right for navigation to next image.
Can this be done using the theme builder by adding some CSS ?
Can this still make it so the images on the site can be edited easily by client?
Or is there a plugin that can do this all the gallery plugin use light boxes and this is what we want to stay away from.
I included a few pics

.
Click: go to full size image on its own page.

Hello There,

Thanks for writing in! You can make use of the bundled 3rd party plugins to have a custom grid layout in your site. Please go to X/Pro > Overview > Extensions and install Essential Grid or The Grid plugin. To know more about this plugins, please check this:


You can see the demo grids from this links:


Hope this helps.

I looked at the plugin you talk about I could not see that function possible… can you provide a link to this look of a grid and the pic opens not in in a light box but its own page?

Hey @rotation,

Here’s an example using the Essential Grid https://essential.themepunch.com/masonry-blog-jimmy-carter/. Please also browse other demos and read the documentation of the Essential Grid here especially regarding the Skin Editor. The Skin Editor will provide you more options.

Here’s an example using The Grid https://theme-one.com/the-grid/kampala/. Please also browse their other demos and read the documentation of The Grid here especially the Skin Builder. The Skin Builder will provide you with more options.

What you’re trying to achieve is possible with both of the plugins. It would be best you try both to know what plugin will suit your client’s needs.

Thanks.

thanks that helped now just gotta do some custom code.

any idea how to get rid of the title from showing up in a portfolio post and the date and user that published the post? How about making it so the image shows up full screen or to full size that the file size up to 1200 x 1000.

Hello There,

Thanks for updating in!

1.) To get rid of the title from showing up in a portfolio post and the date and user that published the post, please add the following CSS code in the X > Launch > Theme Options > Global CSS (http://prntscr.com/evui3r)

.single-x-portfolio .entry-header {
    display: none;
}

2.) To make the image fullwidth, please add the following CSS code in the X > Launch > Theme Options > Global CSS (http://prntscr.com/evui3r)

.single-x-portfolio .x-container.max.width.offset {
    max-width: 100%;
    width: 100%;
    margin-top: 0;
}

Hope this helps. Please let us know how it goes.

Both codes worked perfect. Thanks

Question:
How can I add arrows for navigation to get to the next portfolio post ? here is a pic. Can I add any type of vector image?

How can I take of the lines from top and bottom of the share social icons on the post page of each post?
How can can I turn off the social share ? How can I change The text to Black ?

Heres a image:

Hi there,

What’s your site’s current stack? The portfolio single pages should have that arrows already. But some stacks may not display it. Would you mind providing the site’s URL you’re working on?

About the social share, please go to Admin > X or Pro > Launch > Theme Options > Portfolio and toggle them off. As for color, you may change it as well in Typography section.

Thanks!

Not sure what you are saying, how do you toggle them off?
Stack- Integrity
Can I add custom arrows?

anyone know?

Hi there,

Kindly open up new threads for additional questions as it will help us to focus on each issue and give you a better support which you deserve. Having a long threads makes the maintaining job harder and also it will be harder for the other customers to find the correct information if they have similar issues. You are always welcomed to reply to this thread to follow up the same question.

The Integrity stack has the prev/next arrows available in the heading section:

http://demo.theme.co/integrity-1/portfolio-item/sierra-farm/

You need to enable the Breadcrumbs option by going to X > Launch > Options > Header > Breadcrumbs and enable it. Then as the demo link I provided you will have the arrows at the top left section of the page:

Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.