Guitar Animation Image

I still cannot figure out how to change the guitar animation image.

In /css/extensions.css file (around line 213) change this code:

Code: Select all

.gk-animation .gk-guitar {
   background: transparent url('../images/guitar.png') no-repeat 0 0;

Or just replace image file from ..images/guitar.png with your own image(with similar dimensions).

regards..

I changed the code and the image and nothing showed up.

You didn't change the code. In /css/extensions.css file, line 214 still looks like:

Code: Select all

background: transparent url('../images/guitar.png') no-repeat 0 0;

This is full path of guitar image:

Code: Select all

http://milwaukeemusicfestival.com/wp-content/themes/Fest/images/guitar.png

Just replace this image (leave the same filename)
If you will still have problems with it, please send me PM with FTP access (and with your image filename) I'll do it for you.

Yes, because I changed it back. When I changed the code I check my site and the guitar was still there, so I changed it back will send a PM, thanks!

I copied your image (It has other dimensions so I did small modification in the code):

Code: Select all

.gk-animation .gk-guitar {
   background: transparent url('../images/microphone-sh.png') no-repeat 0 0;
   height: 280px;
   position: absolute;
   right: 105px!important;
   text-indent: -9999px;
   top: 187px;
   width: 256px;
   z-index: 1;
}

If you want to change position of your image, just change top and right propierties..

Thanks!

I'm not seeing the new image at all.

Very strange. So are you seeing the original guitar image? Maybe try to refresh browser's cache or please send me a screenshot, because I'm seeing this microphone image
http://milwaukeemusicfestival.com/wp-content/themes/Fest/images/microphone-sh.png next to Milwaukee Music Festival header.

I cleared the caches. Still showing the guitar.

I even check from my iPad and other computers, the same.

Attached screenshot are from top-bottom
Chrome
i.e.
Firefox

Hi,

For me it displays properly - look at the attachment.

Hmmm...Not sure why I'm not seeing it.

I'm not understanding why I'm not seeing the mic image on my end. I've cleared the cache in my browsers. I've tried to look from at least 10 different computers and I'm not seeing the mic image.

It's unbelievable. I removed original guitar.png file and also checked another computers..

I am having a similar issue on thebaconrun.net. I have replaced the guitar image (renamed my image guitar), but can't get the full 302px width to show, the image is cut off to the right. Here is the change I made to the extension.css file, but it made no change in position:
".gk-animation .gk-guitar {
background: transparent url('../images/guitar.png') no-repeat 0 0;
height: 419px;
position: absolute;
right: 0;
text-indent: -9999px;
top: 30px;
width: 302px;
z-index: 2;"
Please Advise.

Hi,

Try something like this:

Code: Select all

.gk-animation .gk-guitar {
background: transparent url('../images/guitar.png') no-repeat 0 0;
height: 419px;
position: absolute;
right: 163px!important;
text-indent: -9999px;
top: 99px;
width: 300px;
z-index: 2;
}

First of all you have to change width to 300px at least, now you can position your image using top and right properties..
If you want "THE BACON RUN" as first layer - change z-index property to: 0.

Almost there! By changing the header to 169 it moved over to the left, but is now still displaying half the image. Here's what's in the header:

<div class="gk-guitar" data-start="{'opacity': 0, 'right': '-400px'}" data-end="{'opacity': 1, 'right': 169}" data-delay="900" data-time="450">guitar</div>

And despite changing the width to 400 (image width is 302), it still shows half the image. Here's what's in the extension.css:

.gk-animation .gk-guitar {
background: transparent url('../images/guitar.png') no-repeat 0 0;
height: 419px;
position: absolute;
right: 169px!important;
text-indent: -9999px;
top: 99px;
width: 400px;
z-index: 2;
}
Thanks for the assistance, just a little more tweaking!

Code: Select all

.gk-animation .gk-guitar {
background: transparent url('../images/guitar.png') no-repeat 0 0;
height: 419px;
position: absolute;
right: 0;
text-indent: -9999px;
top: 30px;
width: 187px;
z-index: 2;
}

It's your code from extensions.css, so you didn't change it. Put my earlier code to css/override.css file and enable this option in Fest -> Template Options -> Advanced Tab.

Then you have to customize width and right properties, that's all. (you can set width to 300px and set right properly)

Sent a pm to see if you can help make the changes.

ok, but I don't get a PM from you.

Your css rules from override.css file were commented out. Now its should works, of course you can customize these rules..

How do you find In /css/extensions.css file ?

Hi @tarikyscott, sorry but I don't understand, you want to find extensions.css file? You have to connect to your server through the FTP client and go to wp-content/themes/Fest/css/extensions.css, better place for your own css modifications is css/override.css file.

Hi there,

Wasn't sure whether to start a new thread, as I'm having the same problem as hiphopucit above (with image in place of the guitar).

I initially changed the image and it worked fine (very simple - upload image and then change the image extension in extension.css file). Although when I tried to change it again, it doesn't appear. The image showing on the front at the moment has purple around it - http://www.worldsideshowfestival.com - and my new image that I have uploaded doesn't.

Now I have deleted all occurrence of the purple image, and it's still showing. I've flushed the website's cache, by browser's cache, tried viewing it in a different browser and on three different computers. The new uploaded image is not showing, still I see this old one that I've deleted all occurrence of.

Could you help me please?!

Thanks.

Hello,

@shephuntly, now you have CSS code which shows this image:
http://www.worldsideshowfestival.com/wp ... /podgy.png

And this one was removed by you?

No, that's the image I want, but it's not showing up. Instead the old one is still showing that I've deleted all occurrence of.

Yes it is showing up. I've checked 2 computers and 4 browsers, so I'm sure that it's ok - it's probably problem with the cache. Check my attachment.

Yes, the screenshot you have posted is the image I want. Still I am not seeing it. I have flushed caches on two different browsers, flushed my website's cache and have done the same on a different computer, still I am seeing the image I have deleted.

I can't help you with that, because I see the proper image in all cases. Maybe you should ask your server provider if there may be some other cache settings (not connected with your plugins).

Hi

Piotr asked me to check that for You and I must say I see new image as well. This is showing old image for You because of cache. Please clear browser cache couple of times or check in a different browser which You weren't using yet to see this site.

Hey guys, just want to say that there must be a caching problem on your end? I've been trying to reposition the tattoo image for weeks. It takes about two weeks for the image to move. I've been trialing moving it up and down to get into the right position, and with the latest move (which should be about right), the image is still showing it's too high. What do you see on your end? I have a client that's pretty pissed off at the moment and is waiting to launch his sight. Any help would be appreciated. Thank you.

Hi, Please check the attachment, is it ok?
Regarding the cache - in our themes, we don't have any cache, except our widget like news show pro, image show etc, but in this case there's text widget used, so I'm sure it's no cached. Did you ask your server provider about some caching system?

Hi I am the pissed off client Shep is talking about, I don't understand all the techno jargon I just know SOMETHING IS WRONG.
Its great you have a forum for yr clients to ask questions but WHEN WILL YOU FIX IT. it has been weeks............
We can see it works at yr end but it doesn't work in the real world, WE NEED HELP and we need it NOW.
Come on guys, here is a challenge for you. PLEASE PLEASE PLEASE PLEASE SORT THIS OUT.

I would like to help, but I have no idea where exactly the problem is. I've attached the screenshot - the image on the screenshot is in the right position? could you show me the screenshot from your browser? Did you ask your hosting provider if any caching system is available on the server?

The guy who made the site for me assures me he has done everything he can, he is practically pulling his hair out. how do i show you a screen shot?

http://www.worldsideshowfestival.com/

Sorry, but I still don't understand, the image on my screenshot 4 posts above is on the correct position? You said that on your browser it's not in the correct position, could you takea screenshot how exactly it look in your browser?
http://www.take-a-screenshot.org/

or better, could you send me a Private Message with FTP access to your website, then I'll change the image position code and see if it's visible in the browser.

I just spoke to a friend 2000 miles away and he is seeing the same thing as me, our logo, the dagger, is too high, the top two thirds of it are hidden. So it seems like the adjustment has been successful at your end but no where else. You must be able to do something, to someone like me it seems like a simple problem, i cant understand why it could be so hard or take so long.
Should I ask my website guy to delete it and start again? its just that all these delays are costing me money. I need this fixed 3 weeks ago..... HELP, PLEASE HELP

I have the screen shot but everytime I try and drag it in to this chat box it changes the url and the box dissapears
Any help?
Are you still there?

screenshot4.png

screenshot4.png

screenshot4.png