Header view css class depending on content - laravel

I have my website layout structured this way:
header
--content
footer
Where header and footer are #included.
On some pages I have this classes to body
<body class="property-map-append-top has-breadcrumb"> and to other pages: <body class="property-map-append-top">
How can I do this for specified pages?

It depends on what do you mean by 'some pages'. You could pass a variable from a controller, like hasBreadrumb and use it in Blade template:
<body class="property-map-append-top #if($hasBreadcrumb)has-breadcrumb#endif">

Sometimes I do this in my views:
<body class="{{ $bodyClass or 'default-body-class' }}">
You can add classes to the $bodyClass variable in your controllers, but only when you want to override the default class (the string which comes after the 'or'). With this syntax you can opt to not send the variable to the view and still avoid an error.

Related

How can I pass a variable from slot to its layout in Laravel?

I am using Laravel 8 and I can't find a way to solve this problem.
I have a app-layout like this:
<!-- ./app-layout.blade.php -->
<html>
<head>...</head>
<body>
<livewire:create-suggestion />
{{ $slot }}
</body>
</html>
And this view uses the app-layout:
<!-- ./index.blade.php -->
<x-app-layout>
...
</x-app-layout>
In controller, I pass a variable to index view:
public function index() {
return view('index', ['variable', '$variable']);
}
How can I pass this variable to the app-layout? Because I also want to
use this in the create-suggestion livewire component.
Try this. edit your index.blade.php
#extends('app-layout', ['variable' => $variable])
...
You can pass any variable attribute to the layout like so:
<x-layout :myvariable=$myvariable>
or static attribute values like so
<x-layout myvariable="This is a string">
and retrieve it in the layout.blade.php like so:
{{ $attributes['myvariable'] }}
First off I beleive the App Layout will have access to whatever is passed by the view function. But if I am wrong or you wish to pass any custom variable whatsoever using the Layout syntaxt as opposed to template inheritance the way would be: (I came cross your question having a problem passing a static string for my HTML page title and no solution worked until I found this)
<x-app-layout>
<x-slot:variable>{{$variable}}</x-slot>
</x-app-layout>
However your issue is you are using Livewire and livewire is not simply just a view! Laravel Intentionally makes Livewire independent from the rest of the page. You would have to either pass it in PHP as param during mount which will only be accessible if set during the mount function() in \App\HTTP\LiveWire\createSuggestion.php
#livewire("create-suggestion",[ $variable])
Or ideally you have your javascript use the $emit feature to pass the element to the livewire listener all handled via Livewire. It seems to me you are using Livewire for something that you should simply only use Blade/Views:
#include("create-suggestion");

blade template, #yield at extended view

I would like to define a section at the layout or at an include, such as:
/views/master.blade.php
#section('mysection')
content here
#stop
#yield('content')
And be able to yield it at the view inheriting the layout:
/views/home.blade.php
#extends('master')
#section('content')
#yield('mysection')
#stop
From what I've tested this doesn't work. Is there another way of doing this?
Some sections are not supposed to always render and also not in the same place as they are on the layout, so the yield method would do what I need.
You can try to modify the master.blade.php as:
/views/master.blade.php
#section('mysection')
content here
#show
#yield('content')

How do I insert unique meta tags per page using docpad events

I'm trying to write a docpad plugin that will allow me to insert meta tags unique to each page, for example og:title or og:description. I've been able to accomplish this globally with the populateCollections event for global values, but have not been able to do this per page.
I'd like for this to work without the need for a template function so that the meta tag is inserted automatically based on the document's meta. One way might be to grab the contentRendered value in the writeBefore event and do string manipulation that way, but that seems hacky.
Any ideas?
This worked for what I needed. Basically, I'm getting the rendered content right before the file is written using the writeBefore event, and doing a very simple string replace which adds the meta tags and their unique values, which is pulled from the model in the collection.
writeBefore: (opts) ->
docPad = #docPad
templateData = docpad.getTemplateData()
siteUrl = templateData.site.url
for model in opts.collection.models
if model.get('outExtension') == 'html'
url = #getTag('og:url', siteUrl+model.get('url'))
title = #getTag('og:title', model.get('title'))
content = model.get('contentRendered')
if content
content = content.replace(/<\/title>/, '</title>'+url+title+description)
model.set('contentRendered', content)
# Helper
getTag: (ogName, data) ->
return "\n <meta property=\"#{ogName}\" content=\"#{data}\" />"
Great answer David, leaving this one if someone faced the same issue I did.
Check if meta tag is broken, if it is - don't render:
renderBefore: (opts) ->
for model in opts.collection.models
if model.get('date').toLocaleDateString()=='Invalid Date'
model.set('write', false)
docpad.log model.get('title')+' has broken date format!\n\n\n\n\n'
false
I am using partials in with collections. Adding what is needed in the document like this:
```
title: Meetings and Events
layout: page
description: "This is my custom description."
tags: ['resources']
pageOrder: 3
pageclass: rc-events
```
I needed a custom CSS class by page. Then you can call it in your default template like this.
<div id="main" class="container <%= #document.pageclass %>">
Should be the same for meta
<meta name="description" content="<%= #document.description) %>" />
or check your docpad.coffee file and put together helper function for prepared content based off of a default site value combined with a #document value. Then you can just call something like the default:
<meta name="description" content="<%= #getPreparedDescription() %>" />
Which is built by this helper function:
# Get the prepared site/document description
getPreparedDescription: ->
# if we have a document description, then we should use that, otherwise use the site's description
#document.description or #site.description

Can I use Kendo MVC helpers inside templates?

I need to use Kendo MVC helper Razor code in template as listed below:
<script id="some-reusable-control" type="text/x-kendo-template">
#(Html.Kendo().Window()
.Name("details-window"))
</script>
But the problem is rendered HTML+JS contains a # (sharp symbol) that is rendered as part of #= # syntax inside template. So I getting 'parse error'.
<div id="details-window" style="display:none"></div><script>
jQuery(function(){jQuery("#details-window
").kendoWindow({animation:false,modal:true,draggable:true /*, etc */ });});
</script>
Could anyone please provide me a solution of how to use Kendo helpers in templates.
To use Kendo UI Widgets as content for a template you could use the ToClientTemplate method.
e.g.
<script id="some-reusable-control" type="text/x-kendo-template">
#(Html.Kendo().Window()
.Name("details-window")
.ToClientTemplate())
</script>

Load a view inside another view

I've been using django for some time and I decided to start a new project but this time in Codeigniter, I used to extend the template file in my views and put content inside the {% block content %} block but it seens to be different in CodeIgniter.
In CodeIgniter I have something like:
<?php
$this->load->view('header');
$this->load->view('form_add_customer');
$this->load->view('footer');
?>
But is there a way to have an unique file with header, content and footer like this?
<html>
<head><title>Test</title></head>
<body>
<div id="header">Welcome</div>
<div id="content">
</div>
<div id="footer"> 2013 - Tectcom Telecom</div>
</body>
</html>
And put a view file with a form inside the content div?
Update your html (layout) file like this:
<div id="content"><?php $this->load->view($content) ?></div>
In your controller, call the view like this:
$view_data = array();
$view_data['content'] = 'form_add_customer';
$this->load->view('path/to/layout', $view_data);
I've used the "Most Simple Template Library for CodeIgniter" in the past with success for smaller projects. I believe it'll provide with the functionality that you require allowing you to have placeholders in a 'template' which you can update in your controller logic.

Resources