MyBB Community Forums

MyBB Community Forums > Community > General Discussion > Web Development and Administration > Laravel Blade | <head> contents placed in body and extra spaces added
Full Version: Laravel Blade | <head> contents placed in body and extra spaces added
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2

Josh H.

2012-12-24, 02:48 AM
So I am working on a custom blog to integrate with MyBB, using laravel. Today, I noticed a few huge mistakes in my code.

Here's the code:

viewpost.blade.php (actual view that has data):
Quote:@layout('common.index')

@section('navbar')
<li class="active"><a href="http://localhost/ext/public/blog">Home</a></li>
<li><a href="http://gamervoid.com">Forums</a></li>
<li><a href="http://localhost/ext/public/thing">Thing</a></li>
@endsection

@section('data')
<div id="post_container">
@foreach ($posts as $p)
<div class="post_post_container">
<h2>{{HTML::link("/blog/view/$p->id", $p->title) }}</h2>
<small>Posted at {{ $p->created_at }}</small>
<p>{{ nl2br($p->body) }}</p>
</div>
</div>
@endforeach
@endsection

common/index.blade.php (layout):
Quote:<!DOCTYPE html>
<html>
<head>
<title>Test page</title>
{{ HTML::style('css/global.css') }}
</head>

<body>
<div id="container" class="container">
<div id="header">
<div id="logo"><a href="http://localhost/ext/public/"><img src="http://gamervoid.com/images/dark/ice/logo.png" alt="logo" /></a></div>
<div id="panel">PANEL</div>
</div>

<!-- ADD BOOTSTRAP NAV MENU HERE -->
<div class="navbar">
<div class="navbar-inner">
<ul class="nav">
@yield('navbar')
</ul>
</div>
</div>
@yield('data')
</div>
</body>
</html>

Clearly, the CSS inclusion and the Title tag are within <head> and </head>, but Chrome outputs:
Quote:<html><head></head><body>


<title>Test page</title>
<link href="http://localhost/ext/public/css/global.css" media="all" type="text/css" rel="stylesheet">



<div id="container" class="container">
<div id="header">
<div id="logo"><a href="http://localhost/ext/public/"><img src="http://gamervoid.com/images/dark/ice/logo.png" alt="logo"></a></div>
<div id="panel">PANEL</div>
</div>

<!-- ADD BOOTSTRAP NAV MENU HERE -->
<div class="navbar">
<div class="navbar-inner">
<ul class="nav">
<li>« Back</li>
<li>| Forums</li>
<li>Thing</li>
</ul>
</div>
</div>
<div id="post_container">
<div class="post_post_container">
<h2>Test post</h2>
<small>Posted at 2012-12-24 01:33:04 by JHTech100</small>
<p>This is the initial blog post. You should delete it.</p>
</div>
</div>
</div>

</body></html>

Note the blank <head> tags, and also the blank space at the start of the body tag.

Can anyone spot the issue with my code?

Euan T

2012-12-24, 12:11 PM
I take it to output the view you are using

return View::make('viewpost');

Indenting your actual code might help figure out the problem quicker too. I haven't really looked at it properly yet but I will later on for you.

Euan T

2012-12-24, 12:20 PM
Ok, here's the formatted and edited code:


viewpost.blade.php

@layout('common.index')

@section('navbar')
<li class="active"><a href="http://localhost/ext/public/blog">Home</a></li>
<li><a href="http://gamervoid.com">Forums</a></li>
<li><a href="http://localhost/ext/public/thing">Thing</a></li>
@endsection

@section('data')
<div id="post_container">
	@foreach ($posts as $p)
	<div class="post_post_container">
		<h2>{{HTML::link("/blog/view/$p->id", $p->title) }}</h2>
		<small>Posted at {{ $p->created_at }}</small>
		<p>{{ nl2br($p->body) }}</p>
	</div>
	@endforeach
</div>
@endsection

comon.index.blade.php

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Test page</title>
		{{ HTML::style('css/global.css') }}
		{{-- Personally I would use the Asset class here to handle CSS/JS --}}
	</head>

	<body>
		<div id="container" class="container">
			<div id="header">
				<div id="logo">
					<a href="http://localhost/ext/public/">
						<img src="http://gamervoid.com/images/dark/ice/logo.png" alt="logo" />
					</a>
				</div>
				<div id="panel">PANEL</div>
			</div>

			<!-- ADD BOOTSTRAP NAV MENU HERE -->
			<div class="navbar">
				<div class="navbar-inner">
					<ul class="nav">
						@yield('navbar')
					</ul>
				</div>
			</div>
			@yield('data')
		</div>
	</body>
</html>


You had an incorrectly nested loop in viewpost.blade.php which I have fixed. Whether or not it'll help I don't know.

Josh H.

2012-12-25, 02:22 AM
I saw a loop problem in viewpost, but I fixed that before posting here.

Btw euantor, common.index means common/index.blade.php Wink

I think I meant to use the asset class, but I guess style came up before asset.

Thanks, and I'll text that code soon!
Oh sorry. I posted the wrong file. viewpost.blade.php (view single post) is

Quote:@layout('common.index')

@section('navbar')
<li>&laquo; Back</li>
<li>| Forums</li>
<li>thing</li>
@endsection

@section('data')
<div id="post_container">
<div class="post_post_container">
<h2>{{ $blogpost->title }}</h2>
<small>Posted at {{ $blogpost->created_at }} by {{ $blogpost->user }}</small>
<p>{{ nl2br($blogpost->body) }}</p>
</div>
</div>
@endsection

Tom K.

2012-12-25, 08:51 AM
I'm not sure why that is happening. The code seems fine. Maybe try using Asset Smile

Josh H.

2012-12-25, 09:18 PM
Asset made things worse. I used Asset::add('globalcss', CSS/global.css), then Asset::styles() and it broke the page.

Euan T

2012-12-25, 10:41 PM
Where did you add the CSS? It should be handled by your controller (personally I extended a base controller which adds global assets and sets a few rules for certain actions such as CSRF checks on Port requests).

Josh H.

2012-12-26, 12:32 AM
I added it in the view. Am I supposed to do it in the controller -- because that makes a lot less sense.
PS: HTML::style was used in the example view. That's why I did it that way at first.

Euan T

2012-12-26, 09:53 AM
Yes, you should use Asset in your controllers then load the assets in the views.

Josh H.

2012-12-26, 08:00 PM
Well... I guess I'll try that.
Pages: 1 2
MyBB Community Forums > Community > General Discussion > Web Development and Administration > Laravel Blade | <head> contents placed in body and extra spaces added