-
AuthorPosts
-
May 8, 2015 at 6:29 pm #441712
I am using Enfold theme andI have a Portfolio Grid page set up to open Portfolio Elements in an AJAX Portfolio. Thumbnails appear below an enlarged image and hovering over thumbnails on desktop/laptop changes the large photo to the one hovered. This won’t work on mobile, therefore I’d like to add navigation arrows in addition to the thumbnails if possible. I’d actually like to add navigation arrows to use on desktop/laptop as well as mobile as an additional means of viewing photos.
What CSS can I add to make this happen?
- This topic was modified 9 years, 6 months ago by larrywillisva.
May 11, 2015 at 2:27 pm #442454Hi larrywillisva!
not sure what you mean, as there are already arrows on desktop as well as on mobile:
However, it sounds like custom work to me, which would be out of our support scope. You can find someone who can do this job for you here.
Cheers!
AndyMay 11, 2015 at 4:02 pm #442521Hi Andy,
Those arrows only go from one portfolio to the next, not one photo to the next in the same gallery.The only way to make it work on mobile is to change “gallery” to “slideshow” in the portfolio entry. Then I lose the thumbnails completely and I really like the look of them.
I’ve set up the Deep Run entry as slideshow and the Tucker entry as gallery. Would love to have navigation arrows on all devices while still using the thumbnails.
- This reply was modified 9 years, 6 months ago by larrywillisva.
May 15, 2015 at 4:56 pm #445034Hi!
Try adding this to your custom CSS.
@media screen and (max-width:767px) { .prev-slide, .next-slide { display: block !important; opacity: 1 !important; visibility: visible !important; } }
That will make it so you can cycle through them on mobiles as well.
Cheers!
ElliottJune 4, 2015 at 5:01 pm #454604Sorry for the delay in response, but I am just now testing the code and unfortunately it didn’t work.
The Tucker gallery with thumbnails still won’t work.June 5, 2015 at 8:20 am #454976Hey!
Not sure if I’ve missed something but all I can see is Highland Springs High School Graduation on the page you linked?
Regards,
RikardJune 9, 2015 at 3:21 pm #456751We have graduations this week and I had to remove the test data. I was hoping to resolve this before posting portfolios, but will have to revisit it after graduations are finished this week. There will be active photo galleries tomorrow though, if that helps. We’ll just be using the slideshow (not the gallery) this time as the gallery doesn’t have navigation arrows on mobile.
June 10, 2015 at 4:19 pm #457323Hi!
It looks like you turned the AJAX feature off. Turn it back on and add the CSS code to the top of the Dashboard > Enfold > General Styling > Quick CSS field.
Regards,
ElliottJuly 16, 2015 at 5:38 pm #474478I’m ready to revisit this topic as school is out for the summer.
http://henricoschools.us/photo-galleries/
I’ve turned the AJAX feature on and added preview images for the first portfolio entry (Freeman).
The CSS code provided above has been added and I don’t see any arrows.I want arrows to appear on all devices for navigation so you don’t have to rollover the thumbnails as that won’t work on mobile. If you click the thumbnail on mobile, it opens that photo and arrows appear but they don’t do anything.
July 20, 2015 at 1:03 pm #475753Hey!
not sure what you mean. About which arrows are you talking about? the arrows when hovering over the images? Please use screenshots to make things clear (imgur, dropbox).
Cheers!
AndyJuly 20, 2015 at 2:00 pm #475802Hopefully the screenshots will make my request clear. Perhaps I can’t use the AJAX grid for mobile.
July 20, 2015 at 5:30 pm #475976Hi!
I see the arrows fine on my Moto E which uses the latest version of Android. I checked your screenshots but they are displaying as blank for me.
Regards,
ElliottJuly 21, 2015 at 1:41 pm #476473I’m not sure why you can’t see the photos; they look fine on my end. I’ve provided individual links instead.
Click on this link: http://henricoschools.us/photo-galleries/
Click on the first portfolio element – Freeman
You’re saying that you see arrows on either side of the large photo on this page? I don’t see them on any device. There are arrows in the top right side above the photo title/caption, but those navigate between portfolio items not photos within a portfolio item.I want to be able to navigate with arrows in addition to (or rather than) hovering over the thumbnails. If you click on the thumbnail on a mobile device, it opens the one photo and the navigation arrows don’t do anything. You have to close that photo and click on the next thumbnail. Not an ideal situation.
I’m not sure how else to explain what I’m trying to do.
July 21, 2015 at 5:03 pm #476621Hi!
Sorry, I thought you were talking about the navigation arrows. Your talking about the slideshow arrows as seen in the first portfolio item on our demo, http://kriesi.at/themes/enfold/portfolio/portfolio-ajax/.
To get that you’ll need to display the slideshow instead of the gallery in the portfolio post settings.
Best regards,
ElliottJuly 21, 2015 at 5:40 pm #476646The “Single Portfolio: Big Slider” (top, right on that page) does exactly what I want. It has thumbnails and hover works on a desktop, but the slideshow arrows work when you click on a thumbnail; it goes through the photos. Mine just keeps showing the same photo. I must have something set up wrong. If I select slideshow instead of gallery, I don’t get the thumbnails.
July 22, 2015 at 4:45 pm #477206Hi!
When you edit your portfolio post scroll down until you see the “Display Preview Images” option. Make sure that is set to “Slideshow” instead of “Gallery”. You currently have them all set to gallery.
Cheers!
ElliottJuly 22, 2015 at 5:44 pm #477243I’ll just use the slideshow and forget about the gallery, thanks for your help.
-
AuthorPosts
- The topic ‘Portfolio Grid AJAX Portfolio navigation arrows’ is closed to new replies.