I have an XML with the following structure:
<document>
<body>
<section>
<section>
<title>This is a title (this is the element we want to highlight)</title>
<p>This is some content</p>
</section>
<section>
<title>Another title</title>
<p>More content</p>
</section>
</section>
<section>
<section>
<title>Another title</title>
<p>This is some content</p>
</section>
<section>
<title>Another title</title>
<p>More content</p>
</section>
</section>
</body>
</document>
I am trying to figure out an Xpath-expression that marks the first title in the first section in section in body (document/body/section[1]/section[1]/title) but i cant get it to work.
Any suggestions?
It seems that your xpath is fine. However, I suspect of a namespace. Try the following:
*:document/*:body/*:section[1]/*:section[1]/*:title
Solved it. If anyone is in need of a similar solution, this worked for me:
count(../../preceding-sibling::node())+1=1
Related
In the Following the '#yield' function is not working,It is showing as normal words not like blade function keywords
#yield('content')
</div>
#yield('footer')
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Admin | #yield('title')</title>
<!--Has all the sylesheets attached already!-->
#include('Elements/_head')
<!--Custom CSS or CSS Files for particular page-->
#yield('styles')
</head>
<body class="hold-transition skin-blue sidebar-mini" onload="startTime()">
<div class="wrapper">
<!--Application Header-->
#include('Elements/_header')
<!--Application Sidebar-->
#include('Elements/_side')
<!--Page Content Main-->
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
#yield('title')
<small></small>
</h1>
</section>
<!-- Main content -->
<section class="content">
<img id="loader" src="{{url::asset('images/loading.gif')}}">
#yield('content')
</section>
</div>
<!--Footer of Application-->
#include('Elements/_footer')
</div>
<!--Has all the scripts already attached-->
#include('Elements/_base')
<!--Custom scripts for particular pages-->
#yield('scripts')
</body>
</html>
I have a laravel application.
I am using bootstrap in the frontend alongwith blade templates.
I want to add a background image to my landing page.
I am trying to style the page by putting a background image to the body. But its not working as in the image is not showing
Below is my code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Laravel</title>
<!-- Latest compiled and minified CSS -->
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Arizonia' rel='stylesheet' type='text/css'>
</head>
<style>
body {
background-image: {{url('/images/gym_background.jpg')}};
}
</style>
<body>
#include('partials.header')
<div class="container">
#yield('content')
</div>
</body>
</html>
In My chrome console i don't see any error of not loading the image.
The code for content section
#extends('layouts.master')
#section('content')
<div class="row">
<div class="col-md-12">
<h3>Welcome to your neighourbood Gym</h3>
</div>
</div>
<div class="row">
<div class="col-md-12 text-center">
<h1 class="post-title">Plans</h1>
<p>Plans available in our gym!</p>
<p>Click to view</p>
</div>
</div>
<hr>
<div class="row">
<div class="col-md-12 text-center">
<h1 class="post-title">Gallery</h1>
<p>Have a look around our gym</p>
<p>Click to view</p>
</div>
</div>
<hr>
<div class="row">
<div class="col-md-12 text-center">
<h1 class="post-title">Contact us</h1>
<p>Click for more details</p>
</div>
</div>
#endsection
Best Regards,
Saurav
Given the following folder structure:
`/public/images/gym_background.jpg`
Change this:
<style>
body {
background-image: {{url('/images/gym_background.jpg')}};
}
</style>
To this:
<style>
body {
// Add a . in front to look in the right folder + dropping the double {{ }}
background-image: url('./images/gym_background.jpg');
}
</style>
Here is a good read on relative vs absolute paths for the extra curious.
If you don't see the image and there's no 404 error in the network inspector, then probably your image is hidden under some other element that takes all the screen and has solid (white?) background. Try setting the same CSS on div.container, then it should work.
UPD: Scratch that, the problem is curly braces. It will work if you remove those {{ and }}.
I'm new to Laravel and i'm not quite sure yet how everything works. I'm trying to break appart code into various sections by including the begining of the page, and then create a hero section followed by some html in that page.
Everything shows but the html code that is on the page is rendering on top of everything else.
This thread looked like it could be things not being closed but as i see it everything is working as it should
Including header in wrong place Laravel 4
#include('blocks/scripts')
#extends('blocks/hero')
#section('title')
text here
#stop
#section('subtitle')
another text
#stop
<div class="container">
<div class="row">
<div class="col-12">
more text
</div>
<div class="col-6">
<h2 class="text-center">header</h2>
<p class="text-center">more text</p>
</div>
<div class="col-6">
<h2 class="text-center">header</h2>
<p class="text-center">more text</p>
</div>
</div>
</div>
#include('blocks/footer')
This is the file. The HTML block is being rendered right after the "scripts", followed by "footer" and then it shows the "hero".
The order should be scripts->hero->html->footer
#include('blocks/scripts') just has html code
#extends('blocks/hero') has #yield('title') and #yield('subtitle')
#include('blocks/footer') just text
I changed the names of some templates because it is difficult to understand the code what you put in the comments. But I think it can help you to organize your code.
The template where you have the html, head and body tags, is not a template to be included, but to extend other templates from it, and make use of a yield. For example #yield ('main-content'):
blocks/main.blade.php:
<!doctype html>
<html lang="{{ app()->getLocale() }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
</head>
<body>
#yield('main-content')
</body>
</html>
blocks/hero.blade.php
This is a template that you could extends from the main one and adding content to the #yield('main-content') with #section('main-content'):
#extends('blocks/main')
#section('main-content')
<div class="container-fuid mx-0 wlgx_hero">
<div class="row">
<div class="col-12">
#include('blocks/header')
<section id="hero_text">
<h1 class="text-center text-white py-5">
#yield('title')
</h1>
<hr class="purple_line pb-3">
<section id="subtitle">
<p class="text-center">
#yield('subtitle')
</p>
</section>
</section>
</div>
</div>
</div>
#yield('hero-content')
#endsection('main-content')
The blade in your question (I don't know the name) can, in turn, extends from hero, and fill their yields:
#extends('blocks/hero')
#section('title')
text here
#stop
#section('subtitle')
another text
#stop
#section('hero-content')
<div class="container">
<div class="row">
<div class="col-12">
more text
</div>
<div class="col-6">
<h2 class="text-center">header</h2>
<p class="text-center">more text</p>
</div>
<div class="col-6">
<h2 class="text-center">header</h2>
<p class="text-center">more text</p>
</div>
</div>
</div>
#stop
The last one is the view that you have to return from a route or controller, so that everything works.
Hope it's help
In blade files, every direct HTML outside of #section('something') will be rendered at the top of the file.
You need to put #yield('something') in the extended file then wrap your HTML code with #section('something') and #endsection('something') like what you do with title and subtitle.
Here is the content of my home.blade.php file:
#extends('layouts.master')
#section('content')
#extends('partials.sidebar')
#section('pagecontent')
This is home
#endsection
#endsection
layouts/master.blade.php contains the main layout which has the typical <html><head><body>structure. In it's <body>, I am yielding to a section called content:
<!DOCTYPE html>
<html>
<body>
<div id="app">
#yield('content')
</div>
</body>
</html>
and in my parials/sidebar.blade.php, I am yielding to a section called pagecontent:
<div id="page-content-wrapper">
<div class="container-fluid">
#yield('pagecontent')
</div>
</div>
So I would naturally expect a DOM like this:
<!DOCTYPE html>
<html>
<body>
<div id="app"> <!-- #section('content') -->
<div id="page-content-wrapper">
<div class="container-fluid">
This is home <!-- #section('pagecontent') -->
</div>
</div>
</div>
</body>
</html>
Unfortunately, that's not the DOM my blade views are rendering. My sidebar partial doesn't get injected inside the master layout, instead, it is appended to the DOM as a sibling of the Entire Document:
<div id="page-content-wrapper">
<div class="container-fluid">
This is home <!-- #section('pagecontent') -->
</div>
</div>
<!DOCTYPE html>
<html>
<body>
<div id="app"> <!-- #section('content') -->
</div>
</body>
</html>
How can I fix this?
You can't use #extends like this. Use #include instead:
#include('partials.sidebar')
In my favorite templating frameworks they typically have the ability to nest layouts. Is this something that is possible in Blade?
For example...
master.blade.php
<html>
<head><!-- stuff --></head>
<body>
#yield('content')
</body>
</html>
nav.blade.php
#extend('master')
<nav>
<!-- nav content -->
</nav>
#yeild('content')
breadcrumb.blade.php
#extend('nav')
<breadcrumb>
<!-- breadcrumb content -->
</breadcrumb>
#yield('content')
home.blade.php
#extend('nav')
#section('content')
<home>
<!-- content -->
</home>
#endsection
about.blade.php
#extend('breadcrumb')
#section('content')
<about>
<!-- content -->
</about>
#endsection
The reason I love this format is that it makes it extremely elegant (IMO) to be able to choose your injection point!
Have a one off landing page...reference master
For the homepage...reference nav
For any subpages (about/nav/product) reference breadcrumb
The layouts cascade and 'content' gets rebuilt with the compiled html as it goes up the tree.
Is this possible? I'm hoping to avoid doing #include in the layouts as I personally find them cumbersome and a bit of an eye sore especially when you get to elements that are repeated often, but not everywhere (breadcrumbs).
EDIT: Based on answers.
Ideally 'content' would be rebuilt and passed up the chain of nested layouts. i.e. If you have the homepage which references nav.blade.php the homepage content gets added to the nav layout and compiled. Then since the nav layout references master.blade.php the compiled layout would be passed up to master and built again. No duplicating of any content.
I'm not sure I get what you're after here. For instance in home.blade.php you extend "nav", which in turn extends "master", but both "master" and "nav" yield content, so the <home> content will render twice.
So, what is your expected output? I'm not sure "home" or "about" should really extend "nav" or "breadcrumb". I think of these two as sort of structural layout components, so it does make sense to me to include them in the master layout. In "nav" you can define a section to extend when your view needs a breadcrumb.
For instance:
master.blade.php
<html>
<head><!-- stuff --></head>
<body>
#include('nav')
#yield('content')
</body>
</html>
nav.blade.php
<nav>
<!-- nav content -->
#yield('breadcrumb')
</nav>
home.blade.php
#extend('master')
#section('content')
<home>
<!-- content -->
</home>
#endsection
about.blade.php
#extend('master')
#section('breadcrumb')
<breadcrumb>
<!-- breadcrumb content -->
</breadcrumb>
#endsection
#section('content')
<about>
<!-- content -->
</about>
#endsection
You forgot using #parent. Here's the example:
master.blade.php
<html>
<head>
{{-- Stuff --}}
</head>
<body>
#yield('content')
</body>
</html>
nav.blade.php
You need to put the nav inside section to tell master layout that this is a content. If you don't, nav will be in the top of master layout (yes, outside html).
#extends('master')
#section('content')
<nav>
<p>nav content</p>
</nav>
#endsection
home.blade.php
In this example, the content section is utilizing the #parent directive to append (rather than overwriting) content to the layout's sidebar. The #parent directive will be replaced by the content of the layout when the view is rendered.
#extends('nav')
#section('content')
{{-- You can control where #parent should be rendered --}}
#parent
<home>
<p>home content</p>
</home>
{{-- You can put your #parent here, give it a try --}}
#endsection
breadcrumb.blade.php
#extends('nav')
#section('content')
{{-- You can control where #parent should be rendered --}}
#parent
<breadcrumb>
<p>breadcrumb content</p>
</breadcrumb>
{{-- You can put your #parent here, give it a try --}}
#endsection
about.blade.php
#extends('breadcrumb')
#section('content')
{{-- You can control where #parent should be rendered --}}
#parent
<about>
<p>about content</p>
</about>
{{-- You can put your #parent here, give it a try --}}
#endsection
Rendered:
home.blade.php
<html>
<head>
</head>
<body>
<nav>
<p>nav content</p>
</nav>
<home>
<p>home content</p>
</home>
</body>
</html>
about.blade.php
<html>
<head>
</head>
<body>
<nav>
<p>nav content</p>
</nav>
<breadcrumb>
<p>breadcrumb content</p>
</breadcrumb>
<about>
<p>about content</p>
</about>
</body>
</html>