Parameter in Route::get caused style to disappear? - laravel

I'm still new to Laravel. Anyway, I'm making a small system of viewing and creating articles to be shown in the main site. I wanted to create a page that displays an article from the database, using a parameter from the URL, like this:
http://localhost:8000/read/1
The above, for example, will display the article with 'id' value of 1 in the database.
So it works just fine, but problem is, after I got it to work (which took me some time since I'm a newbie), the whole style just disappears from the page. I tried to rewrite everything but it still didn't work. New pages that I create include the style just fine.
This is my route line:
Route::get('read/{id}', array('as' => 'read', 'uses' => 'NewsController#readArticle'));
NewsController readArticle function:
public function readArticle($id) {
$article = NewsMessage::where('id', $id) -> first();
return View::make('news.read', array('article' => $article));
}
And the file read.blade.php (located in views/news/read.blade.php)
#extends('layouts.main')
#section('content')
{{ $article -> title }}
#stop
So the whole PHP code works fine and I manage to get the title. But for some reason, the whole style disappears and this is what I see:
http://puu.sh/ctO6J/db30fbe102.png
So any idea, what have I dont wrong that caused this? The other pages work just fine with the style included.
Thank you!

The issue is that the path to the image is incorrectly specified.
You can either use the built in asset methods or something like {{ URL::to('/')/imagepathhere/filename.jpg }}

Assuming you have your styles links wrote as:
#extends('layouts.main')
#section('styles')
<link href="css/custom.css" rel="stylesheet" />
<link href="css/styles.css" rel="stylesheet" />
#endsection
#section('content')
{{ $article -> title }}
#endsection
Correct Syntax:
#extends('layouts.main')
#section('styles')
<link href="{{ asset('css/custom.css') }}" rel="stylesheet" />
<link href="{{ asset('css/styles.css') }}" rel="stylesheet" />
#endsection
#section('content')
{{ $article -> title }}
#endsection
And make sure your css folder is located at public folder when calling with asset() helper.
This issues of disappearing the whole page styles is causing by accessing the image or css file or any other resources, and the solution is to use asset() helper function.
NOTE: YOUR ROUTES AND CONTROLLER HAS NO ISSUE, YOU DON'T NEED TO TOUCH EITHER.

Related

Pass the data to errors custom page on laravel

I did create a custom 404 page on my Laravel project by creating a folder called errors and inside the folder I did create a file called 404.blade.php
However when I use a component and I try to pass the data with that component I get an error
<x-main-header-component></x-main-header-component>
</head>
<body>
<!-- Main Header -->
<x-main-navbar-component></x-main-navbar-component>
<!-- ... end User Menu Popup -->
error message here
<x-main-footer-component :message="$SocialMediaLinks"></x-main-footer-component>
</body>
</html>
the error that I'm getting is:
ErrorException
Undefined variable $SocialMediaLinks (View:
What can I do to pass the data to the component main-footer on errors/404.blade.php?
There are more than one ways you can achieve this. Since we have no access to 404Controller or anything like so, I usually come up with several ideas:
Directly import the targetted data source (model for example). This will guarantee result, but the view may look ugly and not that logical.
Caching: Redis, Memcache or anything will help. If your error views are using the same data source as your landing pages (navigation bar, header for example). The idea is that you will use Cache::remember() to store and get data whereever you want. Cache
View composer: (Docs). Cleanest way in my opinion. You just share data to all views (error views included) using global * regular expression.
Use helper: Since helpers are globally available, you can use it to store and retrieve data as you want.
For JavaScript framework component availability, just include it (the .js file) in the error views under resources/views/errors.
Example for the 3rd method:
In your AppServiceProvider#boot:
view()->composer('*', function ($view) {
$view->with([
'somethingToShare' => "Hello world",
]);
});
In your error views:
{{dd($somethingToShare)}}
Now when you open your targetted error view, it should show "Hello World"
I'm assuming you are calling $SocialMediaLinks in your app or footer.
if you are, then use an helper function. i'll add my example below
#if (isset($seo))
<title>{{ $seo->title }}</title>
<meta name="description" content="{{ $seo->meta_description }}">
<meta name="keywords" content="{{ $seo->meta_keywords }}">
#else
#php
$seo = getSEO(); //helper function
#endphp
<title>{{ $seo->title }}</title>
<meta name="description" content="{{ $seo->meta_description }}">
<meta name="keywords" content="{{ $seo->meta_keywords }}">
#endif

How to extend a layout without overwriting the scripts in the layout section (Laravel 5.8)

Ths should be simple enough, but...
I have a layout view dashboard-layout.blade.php with:
#section('headscripts')
<script src="{{ mix('/js/app.js') }}" defer></script>
#show
And a billing.blade.php view that extends the layout file:
#extends('layouts.dashboard-layout')
#section('headscripts')
#parent
<script src="https://js.braintreegateway.com/web/dropin/1.17.2/js/dropin.min.js"></script>
#endsection
The problem is, this only outputs the first script...what am I doing wrong?
You can simply use #stack('name here') instead of #yield('name here')
and use
#push('name here')
// Add Your Script Here
#endpush
instead of
#section('name here')
// Scripts
#endsection
to solve your problem.

How To Add Title For Each Page In Laravel

In my laravel website all pages having same title meta but how to make different title for each page please tell me.
this is my code for dynamic showing in all the pages
<title>{{setting('site.title')}} | {{setting('site.description')}} #if(isset($data->title)) {{$data->title}} #endif</title>
file name is layouts/app.blade.php
Inside your app.blade.php, in the head section.
change:
<title>{{ config('app.name', 'Laravel') }}</title>
to:
<title>#yield('title')</title>
You can choose any name/title that seems fitting.
For other views.blade.php pages,(extending app.blade.php) you can add a title this way:
#section('title','My Title')
this comes after #extends('layouts.app')
You can specify different title for different views.
In you common header file make your title like this:
<title>#yield('page_title', 'Default Title')</title>
Then in your view file change the title to whatever you want it to be set in following way:
#section('page_title')
{{ "Your Title" }}
#endsection
Simply inside your app.blade.php
Put this: #yield('title')
In other pages just extend the layout and put the new title at the this section
#extends('layoutWhateverYouNamedIt')
#section('title')
Type your title here
#endsection
in your controller
public function aboutUs()
{
//page title
$title = 'Project | About Us';
return view('project.about_us', compact('title'));
}
for your view page
<title>{{ $title }}</title>
Inside your app.blade.php,
<head>
#yield('title')
... // other scripts
</head>
For other pages which user app.blade.php you can use it like after extending app.blade.php :
#section('title')
<title> Your Page Title Here </title>
#endsection`
Hope it helps. happy coding.

An error when passing a parameter in a route laravel 5.2

this is my code
route.php
Route::get('test/{id}','testController#test');
testController.php
public function test($id){ return('test'); }
test.blade.php
<!DOCTYPE html>
<html>
<head>
<title>a</title>
</head>
<body>
<img src="myPath/myImage.jpg">
</body>
</html>
The result: the image cant be load
note: when i deleted the 'id' parameter it has worked perfectly
What is the error message you are getting?
You will also probably want to change the return value of testController#test to something along the lines of this so you can actually pass the variable to the view.
return view('test', [
'id' => $id,
])
You may also want to have env('APP_DEBUG',true) turned on to get verbose output
the solution : i have changed the value of the src attribute
<img src="{{URL::to('myPath/myImage.jpg')}}">
You need to use:
href="{{ URL::to('yourfile')}}". Also you should place your images in laravel public folder. If you will create folder img in your public folder then you need to something like this: href="{{ URL::to('img\imgname.png')}}".

Show blade code snippet inside a laravel blade view

I am creating documentation for my blade based components in a laravel project and would like to display syntax highlighted blade code snippets as part of the documentation a la something like this:
I have installed graham-campbell/markdown package and I try use it inside a .blade.php file as follows:
(Do not mind the escape character)
However, the output I get is as follows:
You can wrap the Blade in a #verbatim directive and use Highlight JS with a style you like
<p>You can use the laravel code template like this</p>
#markdown
```php
#verbatim
#include('components.inputs.text', [
'name' => 'input_name',
'label' => 'testing',
])
#endverbatim
```
#endmarkdown
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.10/styles/a11y-dark.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.10/highlight.min.js"></script>
<script>
hljs.initHighlightingOnLoad();
</script>
Result
Hope this helps

Resources