I am new in Laravel. I watched some tutorials on youtube and try something did a blade template but it couldn't load, it gave me a message
Whoops, looks like something went wrong.
my code
Route.php
<?php
Route::get('list', 'HsController#getList');
HsController.php
<?php
class HsController extends BaseController {
public function getList()
{
return View::make('List');
}
}
in views folder i have a folder named Layout include some files such as: main.blade.php, foot.blade.php, menu.blade.php
main.blade.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<link rel="stylesheet" type="text/css" href="">
</head>
<body>
#include('layout.menu');
#yield('content');
#include('layout.foot');
</body>
</html>
foot.blade.php
<div>
Footer. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat
</div>
menu.blade.php
<nav>
<ul>
<li>Home</li>
<li>About</li>
<li>Test</li>
</ul>
</nav>
and important thing is list.blade.php :
#extends('layouts.main')
#section('content')
<p>This is my body content.</p>
#stop
please correct my code
thank you very much
First error is in list.blade.php file
You have:
#extends('layouts.main')
it should be:
#extends('layout.main')
because the folder name is Layout. Another possible problem is the name of Layout directory. You should change it into lowercase layout - because on Linux webserver it won't probably work.
Related
I am trying to setup Laravel with Vue, but for some reason nothing is being rendered at the moment.
This is the code I have:
main layout file (main.blade.php)
<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />
<title>Pathfinder Character Sheet</title>
<link href="{{ asset('css/app.css') }}"/ rel="stylesheet">
<link href="{{ asset('css/light-bootstrap-dashboard.css') }}" rel="stylesheet">
<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.7.0/css/all.css" rel="stylesheet">
<link rel="stylesheet" href="https://static.fontawesome.com/css/fontawesome-app.css" rel="stylesheet">
</head>
<body>
<div id=character-sheet>
<master></master>
</div>
<link rel="js" href="{{ asset('js/app.js') }}">
</body>
</html>
app.js file
import Vue from 'vue'
import Master from './components/layout/Master'
require('./bootstrap');
require('./light-bootstrap-dashboard');
window.Event = new Vue()
window.Vue = Vue
const app = new Vue({
el: '#character-sheet',
components: {
Master
},
template: '<Master/>',
});
Master.vue
<template>
<div class="wrapper" id="character-sheet">
<span>Lorem ipsum dolor sit amet consectetur adipisicing elit. Incidunt excepturi, ex exercitationem laborum beatae nostrum molestiae inventore eos amet ut debitis nam accusamus illum ipsa soluta ipsam officiis doloremque rerum.</span>
</div>
</template>
<script>
export default {
name: "Master"
}
</script>
I am not getting any error, just a blank screen (app.js file is loaded).
What am I doing wrong here?
Remove the id="character-sheet" from Master.vue
In app.js use as follows.....
Vue.component('master', require('./components/layout/Master.vue').default);
const app = new Vue({
el: '#character-sheet' });
Run the command: npm run dev
Your HTML Id is not quoted.
Change <div id=character-sheet>
To <div id="character-sheet">
id must be unique, you're putting two elements with same id nested. Try not putting the component inside that tag.
...
<body>
<master></master>
<link rel="js" href="{{ asset('js/app.js') }}">
</body>
...
I'm creating a project with Springboot and Thymeleaf. I configured the whole project, found the template and the pages, so my template can not find the css and js files;
I'm use Springboot version 1.4.2.RELEASE.
Html
<link rel="stylesheet" th:href="#{/bootstrap/css/bootstrap.min.css}"/>
application.properties
# --- CONFIGURAÇÃO TYMELEAF ---
spring.thymeleaf.suffix=.html
spring.thymeleaf.mode=HTML5
spring.thymeleaf.cache=false
spring.thymeleaf.content-type=text/html
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.check-template-location=true
spring.thymeleaf.enabled=true
WebMvcConfigurerAdapter
#Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/resources/**")
.addResourceLocations("/resources/")
.addResourceLocations("/static/")
.addResourceLocations("/static/**")
.addResourceLocations("/resources/static/")
.addResourceLocations("/resources/static/**")
.addResourceLocations("/")
.addResourceLocations("/**");
}
Folders
UPDATE
I did as recommended and removed all the settings. So this time my page opens, so it does not load the starter page.
index
<div class="content-wrapper" th:replace="/starter :: content">
</div>
starter
<div class="content-wrapper" th:frament="content">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
Esse é o Prototipo do layout
</h1>
<ol class="breadcrumb">
<li><i class="fa fa-dashboard"></i> Level</li>
<li class="active">Here</li>
</ol>
</section>
<!-- Main content -->
<section class="content">
<h1>Oi eu sou goku!!</h1>
</section>
<!-- /.content -->
</div>
try this,
<link rel="stylesheet" href="./bootstrap/css/bootstrap.min.css"/>
you don't have to use th:href here.
Background image wont export from Kendo.
Is there a way to get the background image to export to the png file.
I am not clear why the background image won't export.
Dojo is here: http://dojo.telerik.com/#jcbowyer/exuZi
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Kendo UI Snippet - Background Image won't export</title>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.common.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.rtl.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.silver.min.css"/>
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.1.112/styles/kendo.mobile.all.min.css"/>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://kendo.cdn.telerik.com/2016.1.112/js/kendo.all.min.js"></script>
</head>
<body>
<div class="content" style="background: #ffffff;background-image:url(https://static.pexels.com/photos/17666/pexels-photo-large.jpg)">
<p>Lorem ípsum dolor sit amét, pro éu facilis vulputáte témporibus. Eu méi modus requé. Unum gloriátur has et. Modo stet vix ei, apéirian iñsolens plátoñem has ex. Cum eí oporteat inímicus, prí soluta torquatos témporibus éu.</p>
<p>Ut eos assúm mazim vócent, cu gloríatur expetéñdis pro. Héñdrerit ádversarium reprehendunt eos ad, dúo an noster feugiat cotidieque. Vocent erroribus repudiáre ad meí. Oratio soluta eripuit sed éx. Vis et meliore appellañtur, át has discere convenire ocurreret. Eos at mazim melius aliquip, aperiam alterum commuñé pro id, zril soluta efficiantur in sit. Duis mundi duo ex, pér offendit probatus suavítate iñ.</p>
<p>Nec id fácilis similique, audiam moderatius ad eum. Persecuti liberavisse eum ex. Qui anímal audiré et, éum vitae coñsul dolorum eu, ín sed partem antíopam. Velít suscipit te usu. Mea ea melius scripta.</p>
<p>Illum delenit neglegentúr te cum, in errór inimicus disseñtias mel, placérat ocurreret ea vix. Vix ea latine voluptatum. Cúm eu albucius democritum coñsetetur, vix eu dicat deleniti, omñes ínimicus nám no. Nihil molestiae vel ex.</p>
<p>Eú ñominavi placerat his, eu vix timeam qualisque. Príma recusabo torquatós eos ad, ín meí próbo aequé. Ex ñoñumy vóluptua accommodare seá, sit át sanctus detráxit, ín eos case probatus tractatos. Id sit nihíl coñtentíones, ñec ut audiré elaboraret, quo alia ferri múñere ét.</p>
</div>
<script>
var draw = kendo.drawing;
var geom = kendo.geometry;
var contentSize = new geom.Rect([0, 0], [800, 600]);
var imageSize = new geom.Rect([0, 0], [1200, 800]);
draw.drawDOM($(".content")).then(function (group) {
// export the image and crop it for our desired size
return draw.exportImage(group, {
cors: "anonymous"
});
})
.done(function(data) {
kendo.saveAs({
dataURI: data,
fileName: "frame.png"
});
});
</script>
</body>
</html>
There are two limitations of the drawing export,
It does not work on remote files
It does not support certain keywords such as cover for the background.
After addressing those 2 issues the export worked.
Here's the HTML file, it's truncated due to the content size and contained with an "img" tag at the end.
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"
xmlns:epub="http://www.idpf.org/2007/ops">
<head>
<meta charset="utf-8"></meta>
<title>The Waste Land</title>
<link rel="stylesheet" type="text/css" href="wasteland.css" class="day" title="day"/>
<link rel="alternate stylesheet" type="text/css" href="wasteland-night.css" class="night" title="night"/>
</head>
<body>
<section epub:type="frontmatter" id="frontmatter">
<section epub:type="titlepage" id="titlepage">
<h1>The Waste Land</h1>
<div class="aut">T.S. Eliot</div>
<div epub:type="epigraph">
</div>
<p epub:type="dedication">For Ezra Pound: <span xml:lang="it">il migliorfabbro</span></p>
</section>
</section>
<section epub:type="bodymatter" id="bodymatter">
<section id="ch1">
<h2>I. THE BURIAL OF THE DEAD</h2>
<div>Looking into the heart of light, the silence.</div>
<div xml:lang="de" id="ln42">
<em>Od' und leer das Meer</em>.<a epub:type="noteref" class="noteref" href="#note-4">*</a>
</div>
</div>
<div class="linegroup">
<img src="www.href">The lady of situations.
</img>
<div>Here is the man with three staves, and here the Wheel,</div>
<div>And here is the one-eyed merchant, and this card,</div>
</div>
</section>
</body>
Here's my code
HtmlNodeCollection imgNodes= HTMLDoc.DocumentNode.SelectNodes("//img");
or
List<HtmlNode> imgNodes = HTMLDoc.DocumentNode.Descendants().Where(n => n.Name =="img").ToList();
Neither can retrieve any tags. What can i do?
My site has a "nav" div, with links to different html files, a "sidebar" div with static information, and a "content" div, which the different html files get loaded into. I've also set my url base in the header. One of these html files is a long document, and I'd like to be able to include links to sections of this file. So I named the section headers and used the hashtag to link to them:
portfolio.html snippet:
<BODY>
<a id="top"></a>
<header>
PULSE OXIMETRY IN ZAMBIA<BR>
DENGUE DIAGNOSIS IN NICARAGUA<BR>
EYE HEALTH IN INDIA<BR>
MAS.531 COMPUTATIONAL CAMERA AND PHOTOGRAPHY<BR>
MAS.S60 HANDS ON FOUNDATIONS<BR>
<hr>
</header>
<header><a id="pulseox">PULSE OXIMETRY IN ZAMBIA</a></header>
<img src="pulseOx.PNG" width="500px"><BR>
lorem ipsum
</BODY>
And this works wonderfully when I've opened the html by itself. But when it's been loaded into the "content" div within the meta html file, it tries to take me to <myurlbase>#pulseox. How do I make the <a href="#pulseox"> link refer to html doc within the "content" div? I haven't set a base url in the portfolio.html file.
Here's my meta html doc, if that helps:
<HTML>
<HEAD>
<link rel="stylesheet" type="text/css" href="index_test.css" />
<base href="http://myurl/" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#content").load("home.html");
$(".nav-1").click(function(){
$("#content").load("home.html");
});
$(".nav-2").click(function(){
$("#content").load("about.html");
});
$(".nav-3").click(function(){
$("#content").load("portfolio.html");
});
$(".nav-4").click(function(){
$("#content").load("cv.html");
});
});
</script>
</HEAD>
<BODY>
<div id="nav">
<ul>
<li><a class="nav-1">HOME.</a></li>
<li><a class="nav-2">ABOUT.</a></li>
<li><a class="nav-3">PORTFOLIO.</a></li>
<li><a class="nav-4">CV.</a></li>
</ul>
</div>
<div id="sidebar">
myname
<BR><BR>
</div>
<div id="content"></div>
</BODY>
</HTML>