How to add background image at the login page? - laravel

so there is this project iam working on..now i want to add a background image at the login page....i have tried to upload the photo on the public/background folder...then in the css file i have created the directory but so far no changes!!
now my project look like below ..i have uploaded an image named backgroung.jpg on background folder but also in public/background and /public_html/vendors/gauge.js/assets then at my css file html {
background_image:url('public/background/background.jpg')} so far no changes
accountant
app
background
bootstrap
build
config
css
customer
database
employee
garage
garragelogo
general_setting
img
js
.
.
.
html {
background_image:url('public/background/background.jpg')}
i expected a lot i guess help please ......

You need to specify your path relatively like this ../../../public/background/background.jpg which ../ is a backward directory
or you can set your background in your html tag like this
<html style="background: {{ asset('background/background.jpg') }}">
hope it helps

Use this code block for setting background image on any page.
<div class="classToDefineBackgroundSetCss" style="background-image: url('{{asset('assets/bg-slider/bg-slider1.jpg')}}');">
<form>
<!-- LOGIN FORM -->
</form>
</div>

Related

Hostinger Image Wont' Load

I uploaded a website on Hostinger but I have problems with my images. The images isn't being displayed. It is working on my local environment but when I deploy it on hostinger the images won;t display, even the slick.js that i am using for my slider also won't load.I am using Laravel/Jetstream and Livewire for views. Does anyone know how to fix this? Thank you.
This is the Error message that I'm getting
error image
This is what I use to get the images
<img src="{{ asset('image/svg/imageName.svg') }}">
This is what I use to get the js files
<script type="text/javascript" src="{{ URL::asset('js/slick.js') }}"></script>
Directory for the image
root > public > image > svg
Directory for the javascripts
root > public > js

Can't load images in laravel blade files

I've downloaded a template from here.
I want to design pages like that in laravel blade pages, I put css and js files in public folder and link blade files to them, and it works.
But I can't handle images, there isn't a folder for images in this template and I don't know how to load them in my blade pages.
you can upload images on below path
storage/app/public/images
//this way you can use in your blade file
<img src = "{{ asset('/images/YOUR_IMAGE.png') }}" />
but you need to run one command
php artisan storage:link
it will create a symlink from public/storage to storage/app/public
please insert as below path and make link like that.
try this.
<div class="hidden-xs" style="width:200px; height:auto; margin-left:-10px;">
<img src="{{ asset('uploads/logos/myLogo.png') }}">
</div>
If not working... then check your App Url in /.env and restart your app server.
APP_URL=http://localhost
Happy coding~!:)

Laravel, `.png` image in public/images/product folder not displaying correctly

I am a newbie and just want to go from route->view for one image.
The image name is Frozen_Ophelia_800x.png
Here is my route:
Route::get('/products', function(){
return view('/pages/product');
});
Here is my product.blade.php
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h1> <img src="public/images/product/Frozen_Ophelia_800x.png"></img></h1>
</body>
</html>
However, when I access either http://localhost:8000/products or http://127.0.0.1:8000/products I just get a tiny little icon in the top left:
I used command line to move the image to that folder from my Desktop in Ubuntu 18.04.
Here is what my project structure looks like with said image displayed:
You can access images form public folder.
(1) pass path with APP_URL
<img src="http://127.0.0.1:8000/images/product/Frozen_Ophelia_800x.png">
(2) pass path without APP_URL
<img src="/images/product/Frozen_Ophelia_800x.png">
Most likely it's an issue with the image URL being determined relative to the current page, so it would be trying to fetch:
http://localhost:8080/products/public/images/product/Frozen_Ophelia_800x.png
You can confirm that by looking at the developer console in the browser, then the network traffic.
If so, you can rewrite the img tag as:
<img src="/public/images/product/Frozen_Ophelia_800x.png">
Adding the / to the start makes the browser look for the image starting at the site root, so:
http://localhost:8080/public/images/product/Frozen_Ophelia_800x.png

Highlight.js not workng on Laravel 5.3 Target Page

I am developing a Blog with Laravel 5.3. In the Add Post Page, I use CKEDITOR with Code Snippet Plugin. In this area Everything is OK. Code added in the textarea field by plugin is also become highlighted.
In the Target Page I added:
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.8.0/styles/default.min.css">
In the Header section of the page.
and
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.8.0/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
In the footer section of the page.
The page received the following html code from the Database.
<p>The place for Laravel Blade Template.</p>
<pre>
<code class="language-html"><div><h1>
This is a Header</h1></div></code></pre>
<p> </p>
which is showing like this.
<p>The place for Laravel Blade Template.</p> <pre>
<code class="language-html"><div><h1>This is a Header</h1></div></code>
</pre> <p> </p>
So the code section is not highlighted.
How can I do that. What's my wrong? I need Help.
The problem is, that the whole HTML code is escaped, so it won't be interpreted by the browser.
What you want is that only the content between <code class="language-html">...</code> is escaped, so that the Browser renders the code container correctly and that highlight.js can hook into the DOM object.
In Laravel 5 to output non escaped HTML you must use {!! !!}
An example of this:
{!!$myDatabaseHtml!!}

how to put <img> tag in header.php in Wordpress

i have used the following code but it didnt work
/images/ncr.jpg" alt="ncr.com" />
I have pur my image in the images folder of twentyeleven child theme
can anyone help
Thanks in advance..
The theme folder URL can be found at /wp-content/themes/twentyeleven.
Your header file is actually included at the root level, and as such relative paths won't work.
WordPress provides a function to access your current theme's directory, and as a result you should use this code:
<img src="<?php echo get_template_directory_uri(); ?>/images/ncr.jpg" alt='ncr.com'>

Resources