How to Edit Gallery Showcase Module in an easy way

Hello

I bought the quark resto template and I have following questions


1. I want to edit the pictures in the Gallery
>> so I found out the Module Gallery Showcase is responsible for this.
Qestion: Do I have to go directly to the Gallery Showcase module and change the source code with the JCE Editor to get my pictures inside is there somewhere a nice and easy menu where I can change all the pictures (add, delete, etc)

For example if I just want to change the first pic ... do I have to go to the html editor and change this code from:

<div><a href="images/demo/gallery/image1.jpg" data-size="1280x1280" data-title="Carrot cake" data-desc="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur dui at tempor elementum. Aenean convallis metus nec nibh varius hendrerit."><img src="images/demo/gallery/thumb1.jpg" alt="Thumbnail I" width="334" height="334" /></a>


to

<div><a href="images/demo/gallery/mypic.jpg" data-size="1280x1280" data-title="Carrot cake" data-desc="my not latin text"><img src="images/demo/gallery/mythumb.jpg" alt="Thumbnail I" width="334" height="334" /></a>

====================

Or is there just a much more easier way to edit this Showcase Gallery ... with the editor its just a lot of work and not really housewife friendly

Ah yes ... I am a newbie in joomla ... sorry for this so if I ask stupid question because I don't find the right edit buttons and menus don't be too hard on me

Thanks

Maria

Sadly - its not user friendly and disabling tinyMCE (using no editor) or html editor is the best available way.

Hi there!

My way is to :
1. First choose the 15 pictures
2. Rename the pictures to image1 image2 image3 etc.
3. Make thumbs with the filename thumb1 thumb2 thumb3 etc.
4. Copy & paste in filezilla in images/demo/gallery/
5. Change the resolution of image1 image2 image3 so it match.

This way you do not need change the file name in the module but only the resolution.

This the way i do it. It takes around 10 minutes for 15 pictures.

It is still a really nice gallery but it takes time to set it up

Thanks for your help ... especially to xWiz ... I will do it the same way then ...

but true ... nice gallery but not user-friendly ... luckily some friends can explain me a bit html

@xWiz - great workaround, thanks for sharing.
@Stielikone - sadly if you want to have nice ux designs, using only visual editor doesn't allow much. It strips html classes and tags etc. In our templates we decide to use some html only mockup which cannot be edited with wysiwyg to improve the look, but the there is a known cost - less technical users might have some problems and we try to support help when specific questions are asked.

@Cyberek

There is possibly way to make it easier.

1. Make in the quick start version the gallery without description in the photo's (not many will use it i think).
2. Make it unnecessary to change the image resolution of 1 image 2 image 3 etc.

This way you only need to copy & paste the photo's

This is just an idea. It works fine for me but for beginners it would be helpful!

The idea is ok as long as you doesn't take to consideration main gallery page load time.
Just to make it easier to consider:
1. You can use only big images in gallery "grid" layout - but the load time will increase (you need to load big images right away).
2. You can use only small images - but then clicking on them will show same size images.

Of course I'm guessing user will not click all images in gallery to see their big versions - just some of them.

Hi ok.

Just to make it clear.

What i was trying to say is is to keep the thumb and the image, but only make it unnecessary to change the resolutie of image because we now need to change each image manual. So if there is a way that we don't need to change resolution of the image in the HTML module...

The thumb resolution is ok!

Also - if you consider only one element:

Code: Select all

<a href="images/demo/gallery/image1.jpg" data-size="1280x1280" data-title="Modern clock" data-desc="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur dui at tempor elementum. Aenean convallis metus nec nibh varius hendrerit."><img src="images/demo/gallery/thumb1.jpg" height="334" width="334" alt="Thumbnail I" /></a>


its not that hard to understand:

Code: Select all

images/demo/gallery/image1.jpg


is a link to big image,

Code: Select all

data-size="1280x1280"


is big image's width and height,

Code: Select all

data-title="Modern clock"


is a title that shows on popup,

Code: Select all

data-desc="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur dui at tempor elementum. Aenean convallis metus nec nibh varius hendrerit."


is additional text,

Code: Select all

images/demo/gallery/thumb1.jpg


is a link to small image (thumbnail displayed inside grid)

Code: Select all

height="334"


is thumbnail's height,

Code: Select all

width="334"


is thumbnail's width and finally:

Code: Select all

alt="Thumbnail I"


is image alt tag used for seo purpose.

Sadly - big image's size is required by script used to show big images. The only simplification that can be used is to omit thumbnail's size if they are all same width:

Code: Select all

<a href="images/demo/gallery/image1.jpg" data-size="1280x1280" data-title="Modern clock" data-desc="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin consectetur dui at tempor elementum. Aenean convallis metus nec nibh varius hendrerit."><img src="images/demo/gallery/thumb1.jpg" alt="Thumbnail I" /></a>


Haha oke i get it thanks!

No problem.
Please let me know if you would have any additional questions regarding this topic.

What about to combine the photo swipe functionality with Simple Image Gallery Pro. So you can use the galleries with your K2 items.

@thekitchen - could you please be more precise?

I often use the K2 Component with Galleries (SimpleImageGallery Pro).

My idea is to use Photoswipe within an K2 gallery. So if you view a website with desktop you can watch the images with the normal popup engines, but if you view the site with tablet or smartphone hte images in the gallery open with Photoswipe and you can use the touch-effects.

So you dont have to generate all the thumbnails and the right code. It would be easy to use for people who dont know much about HTML, CSS or something.
For example in our soccer club we have some people who write scoresheets. With every scoresheet they upload images of the match.

Is that possible?

I only found a Simple Image Gallery plugin.
http://styleware.eu/store/item/55-photo ... ge-gallery

It would require Simple Image Gallery modification and is beyound our technical support.

Making it easier is good, but use other module i am against.

Here is an idea.

To make your own gallery layout, like 2 columns and different size photo is almost impossible to make. It cost me 3+ hours for making the html code and resizing the JPG. And this gallery i made see the picture is only for my current gallery. If i want a new gallery i need to make html code again and sometimes for 30+ photos. I can't re-use my previous HTML code because there all different format like landscape and portrait photos. I will share the html code of my gallery. Dziudek will provide a fix for my gallery layout, after that i will share it.

Untitled-1.jpg

Ok, now my idea. To make it REALLY easy with photo-swipe gallery, you could make a small program (windows application). What does the program do?

1. Import your files
2. Choose how many column (1,2,3,4 etc.) you want
3. The program gives a preset of the layout
4. You can change the layout by just simple moving the photo's!
5. Download the HTML code that the program had made for you
6. Export the thumbnails that the program had made. ( not really necessary you could make it yourself?)
7. Copy the photos to filezilla,
8. Copy the HTML code in the module.
DONE!

This 8 steps could be in 15 minutes!

But he i am not programmer if i was i would make it.

This would be more friendly to use!

This just an idea and suggestion for QUARK. The photoswipe gallery is AWESOME and hope it would be more easier!

Let me know what you think!

And sorry for my bad English! And sorry for my long post

Wiz

I just bought Quark template for Joomla. This is my first project with Joomla site or CMS at all. I think Quark is very good and looks beautiful.

I was looking for a long time good photo galley plugin and finally I found Quark with PhotoSwipe. It took a time to understand that making a gallery isn't so straightforward.

Hopefully Gavick will make make a plugin for adding a new PhotoSwipe galley quickly. PhotoSwipe gallery is almost best what I've seen before. It works extremely well on different platforms. I'm ready to pay for a good PhotoSwipe plugin or component.

I'll provide your ideas to our devteam. I think gk grid might also help creating custom photo grids that could be easilly adjustable.