Products
GG网络技术分享 2025-03-18 16:12 12
So I attempted to look for a solution:
custom wordpress theme: layout images not displayingIt did not work for me.
My directory for my theme is
wp-content/themes/fearnothing/and consist of these files
/css(folder) /js (folder)
/images (folder)
header.php
index.php
function.php
footer.php
style.css
hrtbrk.gif
hrtbrk.png
css folder contains
fearnothing.cssjs folder is empty
fearnothing.jsMy header.php has the following code:
<!DOCTYPE html><html>
<head>
<title>example title</title>
<?php wp_head(); ?>
</head>
<body>
<img class =\"nightsky\" src=\"wp-content/themes/fearnothing/hrtbrk.png\" alt =\"3\">
functions.php
<?php function fearnothing_script_enqueue(){
wp_enqueue_style(\'customstyle\', get_template_directory_uri().\'/css/fearnothing.css\',array(), \'1.1.2\', \'all\');
}
add_action(\'wp_enqueue_scripts\', \'fearnothing_script_enqueue\');
fearnothing.css
html,body{background: black;
color: #8c0707;
font-family: Courier,Courier New,Lucida Sans Typewriter,Lucida Typewriter,monospace;
font-size: 10px;
cursor: pointer;
}
.nightsky{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 500px;
height: 500px;
}
I\'m trying to add the gif but it did not work. so I tried an image instead. I tested my code offline with html and it works fine?
EDIT I added a images folder to my theme where the theme would be located.
So I figured out a method that works which is not really how I wanted it to work.
I needed to upload the image directly through wordpress media.
Which is stored in /wp-content/uploadsI wanted the images to be inside the themes folder wp-content/themes/fearnothing/images
but for some odd reason the files are being corrupted. (hence the broken image file)
After uploading directly to the uploads folder I was able to use the tag I had originally.
<img class =\\\"nightsky\\\" src=\\\"https://mywesbiteurl.com/wp-content/uploads/2018/12/hrtbrk.png\\\" alt=\\\"\\\" >###
add Home URL above wp-content
<img class =\\\"nightsky\\\" src=\\\"<?php echo home_url(); ?>/wp-content/themes/fearnothing/hrtbrk.png\\\" alt =\\\"3\\\">###
Try using get_stylesheet_directory_uri() function
<img class=\\\"nightsky\\\" src=\\\"<?php echo get_stylesheet_directory_uri()?>/hrtbrk.png\\\" alt=\\\"\\\">Reference link
###
Try this below options.
<img class =\\\"nightsky\\\" src=\\\"<?php echo site_url(); ?>/wp-content/themes/fearnothing/hrtbrk.png\\\" alt =\\\"3\\\">OR
<img class =\\\"nightsky\\\" src=\\\"<?php echo home_url(); ?>/wp-content/themes/fearnothing/hrtbrk.png\\\" alt =\\\"3\\\">
###
Try using get_template_directory() function
<img class=\\\"nightsky\\\" src=\\\"<?php echo get_stylesheet_directory_uri()?>/hrtbrk.png\\\" alt=\\\"\\\">
Demand feedback