?
Solved

Can't disable thumbnail previews in .css (or maybe PHP)

Posted on 2013-02-01
7
Medium Priority
?
258 Views
Last Modified: 2013-03-02
I have a WordPress page I am working on http://flyingarrowmontana.com .  The theme we bought for the customer came with thumbnails on of images along the bottom of the homepage that when selected changed the background image.  After we completed the basics the customer decided they would like it more if the background images were a slideshow and the thumbnails were gone.  I figured it would be easy to get rid of them thumbnails, and maybe a little harder to do the slideshow.

Ironically, the slideshow was really simple and I got it working with no trouble.  I was also able to get rid of a loading bar that came up every time the imaged changed easily enough.  But for the life of me I can't get rid of the thumbnails (without breaking things).

I can disable all the JavaScript related to them and it removes the animation and such leaving just the images (which then just link to the image page instead of changing the background) but that doesn't help me out.  I found in the style.css file #previewHolder which as far as I can tell ONLY applies to those images.  But when I comment it out it breaks the entire page.

If I use firebug and look at the page I can find the html code for the thumbnails and remove it, which works perfectly.  Unfortunately I don't know where in the php files I need to go to remove whatever is the equivalent code (or css or JavaScript).  Using firebug you can also go into the style.css and see the errors that appear when you remove all the #previewHolder sections.

I'm sure this is an easy thing to fix, but I can't for the life of me figure it out.  Thanks for the help.
0
Comment
Question by:mjburgard
  • 3
  • 2
  • 2
7 Comments
 
LVL 1

Accepted Solution

by:
mjburgard earned 0 total points
ID: 38845727
Ok well I might have done it.  In the main.js JavaScript file I found two lines calling #previewHolder.  I commented out those lines without commenting out any of the style.css code or any of the JavaScript code in the actual Gallery.js file.  It seems to be working with no ill effects for now.

Interestingly, when I view the page source with FireBug the html code that calls preview holder is still there.  So I think my solution, while working, is not really the best way to do it.   Would still love for some help on a better way to do this if there is one (sadly you will now get the site with the thumbnails gone, so it will be a little harder to trouble shoot, but I need to leave it like this so the customer is happy).
0
 
LVL 13

Expert Comment

by:joomla_php
ID: 38846702
That's right. Calling code doesn't go away because what it calls has gone away. Depending on the environment, the fix of removing the called thing can generate an error message. You can delete css without generating an error message. Deleting js or php code and then calling it will generate an error message. There is nothing in php that would govern the slideshow or hover activity. These are js and css activities. If you find the html containing <div id="previewHolder"> and its subsequent ul and li tags, and delete these (making sure to get all of it, no more, no less, so there are no open tags with no closers and vice versa), you will have eliminated to call to the css that you previously removed.
0
 
LVL 8

Assisted Solution

by:Alicia St Rose
Alicia St Rose earned 1000 total points
ID: 38847403
Hi mjburgard,
add
display: none;

Open in new window

to
#previewHolder 

Open in new window


No need to touch the js.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
LVL 13

Expert Comment

by:joomla_php
ID: 38847477
mjburgard, agreed, to a point, when you add code to make something not happen, it adds time to process the page.
0
 
LVL 1

Author Comment

by:mjburgard
ID: 38852807
joomla_php

When I delete the #previewHolder css code it either just moves the thumbnails to a different part of the page (if I only delete some of the 4 sections of #previewHolder) or removes the entire menu (if I delete all of the sections).

I do know that the slideshow and hover activities aren't part of PHP.  I can comment out the hover part of the JavaScript and end up with the page just showing non-interactive thumbnails easily enough.

As for finding the HTML, that's my issue.  If I look at the page source I can easily find that section of HTML and remove it (I've tested this with firebug).  But as far as I can tell, there is no actual HTML files in the websites FTP.  If the HTML code exists in one of the PHP or css files then I don't know which one it would be.


laughhearty

That also seems to do the trick, but in the end is it any different then commenting out the lines of JavaScript, performance wise?  Both options seem that they would still load everything and just not show it.  If there is a coding reason as to why using display: none in the css file is the better option please let me know (not trying to counter you, I'm really just ignorant and want to know for the future).
0
 
LVL 8

Expert Comment

by:Alicia St Rose
ID: 38872024
I'm with you mjburgard.
I'm not sure if it does stop the loading. I just find it a quick fix. Would love if anyone else would pipe in on this, cause I'd like to know as well.
0
 
LVL 1

Author Closing Comment

by:mjburgard
ID: 38944852
No real solution, gave some points for helpful comment.  Don't have time to try to find a better answer then what I am using and am not getting any more comments, so just closing the question.
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

There are times when I have encountered the need to decompress a response from a PHP request. This is how it's done, but you must have control of the request and you can set the Accept-Encoding header.
It’s a season to be thankful, and we’re thankful for users like you who engage on site, solve technology problems, and network with others in the industry. What tech are we most thankful for? Keep reading.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
Suggested Courses
Course of the Month15 days, 3 hours left to enroll

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question