I am new to web development / php.
I want to show an image if the image is in root folder its ok by the following script.
<img src='photo_1.png' alt='nayaad_logo' width='100' height='100' align='top' />
but if I place it in a folder it is not displayed:
<img src='/ad_photos/photo_1.png' alt='nayaad_logo' width='100' height='100' align='top' />
how to display an image from a different folder?
Regards:
"ad_photos" folder probably isn't in your web root folder.
try this:
<img src='ad_photos/photo_1.png' alt='nayaad_logo' width='100' height='100' align='top' />
Related
I am trying to render an illustration with the following path /public/illustrations/free_mode.jpg, but for some reason when I navigate to the page where the image is supposed to be rendered the image is not found and yarn dev command exit with code 137. When I checked .next folder I've found all the other images in the cache except for the one causing the error. My code is the following:
<Image
src="/illustrations/free_mode.jpg"
alt="illustration"
width={300} height={300}
className="w-full h-9 md:h-auto md:w-48 md:rounded-none md:rounded-l-lg"
/>
It worked well for other images but when I added this one it doesn't the app server crashed.
To use a local image, import your .jpg, .png, or .webp files:
import freeMode from './illustrations/free_mode.jpg'
<Image
src={freeMode}
alt="illustration"
width={300} height={300}
className="w-full h-9 md:h-auto md:w-48 md:rounded-none md:rounded-l-lg"
/>
I try to use #nuxt/image with image from assets folder; when using image from static folder or external url, the image is optimised as well; but when on using it on image from assets like below:
<nuxt-img
src="~assets/img/Icone-accueil/row_left.svg"
alt=""
class="float-left margin-fleche"
quality="30"
/>
I have this result in my html
<img src="/_ipx/q_30/_nuxt/assets/img/Icone-accueil/row_left.svg" alt="" class="float-left margin-fleche">
but the image doesn't appear
Using #nuxt/image with images from the assets/ folder does not work.
The following is from the #nuxt/image documentation:
Images should be stored in the static/ directory of your project.
For example, when using <nuxt-img src="/nuxt-icon.png" />, it should
be placed in static/ folder under the path static/nuxt-icon.png.
Image stored in the assets/ directory are not proccessed with Nuxt
Image because those images are managed by webpack.
From nuxt documentation:
Inside your vue templates, if you need to link to your assets
directory use ~/assets/your_image.png with a slash before assets.
In your case:
<nuxt-img
src="~/assets/img/Icone-accueil/row_left.svg"
alt=""
class="float-left margin-fleche"
quality="30"
/>
Another quote from nuxt:
When working with dynamic images you will need to use require
<img :src="require(`~/assets/img/${image}.jpg`)" />
In your case check this out:
<nuxt-img
:src="require(`~/assets/img/Icone_accueil/row_left.svg`)"
alt=""
class="float-left margin-fleche"
quality="30"
/>
As per Nuxt Image doc, default direcrtory for images is /static, you can change it by update nuxt.config file as below.
e.g,
image: {
dir: 'assets/images',
},
Now you can rewrite as,
<nuxt-img
src="/Icone-accueil/row_left.svg"
alt=""
class="float-left margin-fleche"
quality="30"
/>
This worked for me:
< img :src="require (~/assets/image.jpeg)"
alt=""
/>
For Nuxt3 users whom are using the edge version, which is v1, of nuxt/image,
if you are self-hosting, place images in the 'public' directory as opposed to 'static'.
Quote from v1 docs:
With default provider, you should put /nuxt-icon.png inside public/ directory for >Nuxt 3 make the above example work.
v0 (Nuxt2)
/static/images/myImage.jpg
v1 (Nuxt3)
/public/images/myImage.jpg
Then, access images in the same way others have described. Nuxt/image v1 does not seem able to read a dir named static and of course doesn't read assets as that is used by Webpack.
I'm using Jekyll with Kramdown on Github, and I want to insert an image in my page. So I use
and include img1.jpg in the folder _posts
The generated HTML is
<p> <img src="img1.jpg" alt="img1" /> </p>
but then the link is
http://username.github.io/projectname/2017/04/27/img1.jpg
and this link does not exist. How can I correct it?
Put image somewhere else (e.g. /images/ directory) and then insert it as .
Am trying to load an image for a view file using this line of code:
<img src="<?php echo base_url('application/assests/images/logo.png'); ?>" alt="" />
Am getting a Access forbidden! error.
The assests folder is under the application folder: root/application/assests/images/logo.png
The assets folder should not be under application, as access to that folder is restricted by the .htaccess file in that directory.
Instead, move the assets folder up one level (so it's at the same point in the file structure as the application folder), and update the code accordingly.
<img src="<?php echo base_url('assests/images/logo.png'); ?>" alt="" />
First edit config to set base_url() as static like:
$config['base_url'] = 'http://localhost/yourprojectfolder/';
Or you can use the below base_url config to set dynamic project root url.
$config['base_url'] = "http://".$_SERVER['HTTP_HOST'];
$config['base_url'] .= preg_replace('#/+$#', '', dirname($_SERVER['SCRIPT_NAME'])).'/';
Do not include your web assests in application folder, There is your MVC....
You can use now for the image:
" alt="" />
or
assests/images/logo.png" alt="" />
Thank you
Im having a hard time with a link to a video file in one of my CI views.
Videos folder is in CodeIgniter root directory. When I link the video file name as following, everything works fine.
<source type="video/mp4" src="/videos/<?= $video->filename ?>" />
But I need to be able to link a file, that is outside of CI root folder, for example somewhere else on C disk, like C:/videos. Cant figure out how to do it. Thanks in advance.
Edit:
Ill be a little bit more specific.
My codeigniter app will be placed on a server in WEB directory:
/something1/something2/web/
Now Video Files folder will be placed on a same level as WEB folder:
/something1/something2/videos/
I want to link videos that are in Videos folder, which is on a same level as WEB(CI root) folder.
If your videos folder is outside your CI-install, you could set the video dir as a config item in /config/config.php:
$config['video_dir'] = 'http://example.com/videos';
You can then retrieve it in your controller like this:
$data['video_dir'] = $this->config->item('video_dir');
(Or you could just have a videos folder inside the CI directory...)
Try It
<source type="video/mp4" src="<?php echo base_url(); ?>videos/<?= $video->filename ?>" />