I have a question.
I am currently building a "blog" website. Not that it matters but..
I am trying to set my background to be a specific image that i have.
And it used to work! Until recently and I just don't know why it wont.
It works when i am on my computer, everything works fine.
But i am using 000Webhost as the hoster for the website.
So if u go to "http://pontuslundhblogg.uphero.com/"
You might see that the website is completely white. Cause the picture wont load for the background.
In my css sheet, i am using:
body {
background-image: url("bakgrund.jpg");
And yes, i did name the picture bakgrund.jpg and uploaded it to 000webhost. Its the exact same name etc. I wondering.. Could two different css stylesheets make so it gets weird or something? Cause I added a second css style sheet to be able to have a drop-down menu in a different sheet, and i added the drop-menu. Around that time it started messing with me..
Is it me doing something wrong.
Or is it 000Webhost?
(Might add that none of my pictures is working now, i can also contribute with more code if needed!)
If you go to pontuslundhblogg.uphero.com/bakgrund.jpg you get a message
"The image pontuslundhblogg.uphero.com/bakgrund.jpg cannot be
displayed because it contains errors".
If you go to pontuslundhblogg.uphero.com/bakgrund1.jpg you get 404 page, which means that the first path (bakgrund.jpg) is correct - but the image itself isn't good.
Try to upload it again or contact the hosting service.
If you use FTP maybe you need to change something in your FTP program settings - maybe change from ASCII to Binary transfer.
http://www.inmotionhosting.com/support/website/file-management/corrupt-file-ftp-transfer
Related
First of all, a cordial greeting, friends! I have a problem, I am working with the design of a web page using WordPress via localhost with XAMPP. I have tried to view the project from different devices (cellphones, tablets) and by configuring the file httpd-XAMPP.config I have managed to enter the address correctly of the project.
The problem is that no image, icon, or logo that I have placed on the page loads (as seen in the attached image), the menu button does not work either.
With nothing more to add and thanking you in advance for any help you can provide, I say goodbye.
Have you checked the image path to see if it's correct?
Are you able to access the image from the full path in a browser for example
domain.com/wp-content/uploads/image.png like this?
Probable solution 1:
Most of the cases, it can be the permalink issue.
Please try to check by changing the permalink, first make it Plain Text and check, if it's not working then make it Post Name and then check. (To do it go to Admin dashboard > Settings > Permalink)
Probable solution 2:
Sometimes, if the image and CSS do not exist in the correct location then happen this kind of issue. Please check it.
Probable solution 3:
Put it in the config.php file
define('WP_HOME','yourdomain.com');
define('WP_SITEURL','yourdomain.com');
Thank you
So I'm new to coding but this seems like a no brainer that I can't seem to work out. I created a proper link saved in a styles.css file but the background color isn't coming up. when I inspect the page it just tells me it can't find the file. What could I possibly be doing wrong here?
And here's the site I'm starting--->
My site
When i did inspect Element on one of the website logo. Image src is as follow.
src="/WSDNPortalTest/Content/themes/images/THP_img.jpg"
Now, I want to try different logo, that i have in my local machine folder.
Is it possible to do that? Advice me. Thanks
It is not possible to inspect and put up your local image. However, you can follow the following steps to achieve the desired result:
Put your image on Google Drive or any other storage server
Generate a sharable link for that image
Inspect the element in your browser
Change image src from src="/WSDNPortalTest/Content/themes/images/THP_img.jpg to src = "sharable-url-here.jpg"
This is how you can achieve the same effect
You can't, but the change will only be valid in that Inspect-session on your local machine. The www would like quite different if it was that easy to change a website! ;-)
see also: How to display local images placed on client machine in HTML webpages
BUT: you could save the entire page using File/Save As and then edit the code locally and replace the downloaded image with your own.
Currently I'm working on magento go. Its not just like Other magento CMS. Its a online CMS where I can manage my store. I need to change the home page design. I have tried to edit CSS files but it doesn't give me the desired output. I want to change the whole page design and want to add my one. Basically I don't get the way to edit the header part. The built in header editing section is known to me but I want to change the whole header part. Am I permit to do this in magento go? I have the html and css file but can not integrated the file in magento go. Is there any solution? Is there any place in magento go to edit phtml file? I need it very badly.Please HELP.
Thanks
Waiting for your reply.
There is a great video series called Magento Community Tutorials on how to customize every aspect of Magento. Link below:
http://www.youtube.com/playlist?list=PL3B0BAAF482B16EAB
However, as I only have the community edition, I am not sure if you can access Magento's server for Magento Go to customize to the level that you can with the Community edition.
Are you able to access all of the files and folders of Magento Go? For example, can you access the server's root folder and see something like this:
If you can, then the video tutorial series will answer all of your questions.
I am not sure if that works. The videos you gave are for magento community version, where you can actually access the FTP of your webhost. Magento go is "server-based" you cannot access the ftp files. I've been having the same problem as pavan.
But I had some level of success in changing some properties in the header portion... well, Header-container actually.
In your CSS Editor, type these code:
.header-container {
background: #FF6666}
This changes the color of your header to a rosy red color. Change the background value to your desired color.
with the other elements, I'm still looking for their classnames, here are some changes I made in my header
.top-cart .block-title strong {
display:block;
padding-right:10px;
background: url(../images/bkg_header-panel.gif) 100% -71px no-repeat ;
font-size:10px;
color:#565051;
font-weight:bold;
text-decoration:none; }
this changed the color of my cart(#) text.
I know this is not much but I hope it helps
Okay, Here is a new way I just found. This method allows you to put a picture in your header portion. btw, If you are using a background color (like I showed below/above), i'd advice you use a transparent bg on your pictures.
upload your picture. Go to Design > Themes Editor > CSS Editor. Click on the Manage button next to Image Assets. Click Browse then look select the picture you want on your header. Then click Upload.
Insert your CSS rules for your Header. The header portion is usually named header-container. So we need to make a css code for this. Type:
.header-container {background: url() ;}
You can add some more options in your background property in CSS. For more information in CSS, try CSS Background Property from w3schools.com
Place your image in your CSS rules. This time, we need to place the "image code" in your CSS rule. Place your cursor between the brackets "()" then Click Manage button in your Image Assets, select the image you uploaded (or the image you want to put in your header) then click Insert File
Again. I hope this helps.
I'm using Lightbox for the first time, and it's working for my images. However, for some reason, I get a strange box at the end of my page that shows the loading icon, even though there shouldn't be an image there.
The image: http://i.imgur.com/ACImB.png
Upon inspecting the element, I get the following HTML code.
<div id="lightbox"><div class="lb-outerContainer"><div class="lb-container"><img class="lb-image"><div class="lb-nav"><a class="lb-prev"></a><a class="lb-next"></a></div><div class="lb-loader"><a class="lb-cancel"><img src="/z/styles/images/loading.gif"></a></div></div></div><div class="lb-dataContainer"><div class="lb-data"><div class="lb-details"><span class="lb-caption"></span><span class="lb-number"></span></div><div class="lb-closeContainer"><a class="lb-close"><img src="/z/styles/images/close.png"></a></div></div></div></div>
The strange part about this code is that I didn't make that div, it seems to have just been inserted by the script. Does anyone know what this might be and how to get rid of it?
This could easily be a problem with your css or script path.
If you look at the lightbox2 demo it displays that loading page you see and then removes it to display the loaded image. When either the javascript or stylesheets are not correctly linked it will not work properly.
Lightbox2 site: http://lokeshdhakar.com/projects/lightbox2/
You can try using (in chrome, for firefox there's firebug) right-click inspect element, go to the resources tab and expand the frames boxes until you see all the images, scripts and style sheets in a list. It'll let you know if one of them can't be found.
I had the same issue when I integrated Lightbox with an MVC site. The issue was I had referred both lightbox.js and lightbox.min.js files. I fixed the issue by removing one reference.