Hi I am newbie learning laravel 4 for creating an application. I am trying to link twitter bootstrap3 files to views using laravel blades. I installed a new laravel application folder.
To remove public from url path i removed all the file in public folder and kept outside of public folder. I changed paths as per the above changes in index.php file.As per my needs i will have two sections in my application one is for users and another is for admin.
So for this i changed my routes.php file like this below.
Route::get('/', 'HomeController#index');
Route::get('/admin', 'AdminController#index');
I created two controllers one for users and another for admin named as HomeController and AdminController. Both files will look like below.
HomeController for Users
<?php
class HomeController extends BaseController {
public function index()
{
return View::make('index');
}
}
AdminController for admin section
<?php
class AdminController extends BaseController {
public function index()
{
return View::make('admin.index');
}
}
Now i created admin folder under views folder for admin section. Thats why i kept admin.index to call admin index page when the url is like this http://localhost/laravel/admin.
Now i created assets folder which has css folder for css files, js folder js files and images folder for images. I want to link these css and js files to my admin view. So i created a layout.blade.php like below.
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Laravel</title>
<link rel="stylesheet" href="{{ asset('assets/css/bootstrap.css') }}">
<link rel="stylesheet" href="{{ asset('assets/css/style.css') }}">
<script type="text/javascript" src="{{ asset('assets/js/jquery-1.10.1.min.js') }}"></script>
<script type="text/javascript" src="{{ asset('assets/js/bootstrap.min.js') }}"></script>
</head>
<body>
#yield('content')
</body>
</html>
After this i changed my view into like this below.
#extends('layout')
#section('content')
<div class="container">
<div class="row clearfix">
<div class="col-md-12 column">
<p>Here Comes Admin Section</p>
</div>
</div>
</div>
#stop
But the assets are not linking. May i know where i am going wrong.
If your asset folder is inside public folder of laravel then user this:
Suppose your folder structure is public/assets/css/bootstrap: Then
<script src="{{ URL::asset('assets/css/bootstrap.css') }}"></script>
Use a virtual host on your server or local machine to remove public from your URL. It's pretty straightforward. Simply Google on how to setup a virtual host for Laravel.
Once you have your virtual host setup, simply place your assets folder in your public directory.
Then in your Blade layout, use:
<link rel="stylesheet" href="{{ URL::asset('assets/css/bootstrap.css') }}">
Related
im using a laravel 5.4 and i have a problem with urls, when i send value with urls like http://localhost:8000/Music/{id} , laravel does not load styles but if use url without value to get that view it loads styles properly, it also does not load styles if an slash get added to end of url like http://localhost:8000/videos/ but without that slash http://localhost:8000/videos works without problem ..sorry i cant speak english good.
here is my code :
Route::get('Music/{id}','homeController#Music');
public function Music(music $item)
{
return view('music',['item'=>$item]);
}
this works by route model binding properly and does what i want but when it returns music blade file it does not load styles that i linked but if use this instead :
Route::get('Music','homeController#Music');
a
public function Music()
{
$item = music::find(1); //for example
return view('music',['item'=>$item]);
}
that works perfect.
i checked this many ways its because of {vlaues} in urls
it also does not loads styles or js files if an slash get added to end of urls
what is the problem?
Use the asset() function...
<html>
<head>
<link href="{{ asset('css/test.css') }}" rel="stylesheet">
</head>
<body>
<div class="square"></div>
<!-- Same for Javascript... -->
<script src="{{ asset('js/app.js') }}"></script>
</body>
</html>
i tested it on this too
<html>
<head>
<link rel="stylesheet" href="css/test.css" type="text/css">
</head>
<body>
<div class="square"></div>
</body>
</html>
I'm starting in on a Laravel project, and having come from past projects using BEM style folder layout (sort by block, not by type), I'd like to do the same within the views folder provided by Laravel. The benefits of having keeping these files together seem obvious, versus mirroring the folder structure in the js/sass folders, but there's some skepticism, prompting the question.
As an example, if I have a modal component, it would exist in:
views/components/modal
and it would consist of:
modal.blade.php
modal.scss
modal.js
So I'm wondering if there are any Laravel specific reasons why I wouldn't want to have a css & js file alongside an #component blade template.
Many people in the Laravel community are using a CRUD/MVC like structure.
Example for views.
views/users/index.blade.php
views/users/show.blade.php
views/users/create.blade.php
views/posts/index.blade.php
views/posts/show.blade.php
views/posts/create.blade.php
Routes (with corresponding methods)
Route::get('/users', 'UserController#index);
Route::get('/users', 'UserController#show);
Route::get('/users', 'UserController#create);
Route::get('/posts', 'PostController#index);
Route::get('/posts', 'PostController#show);
Route::get('/posts', 'PostController#create);
Method example
public function show(User $user)
{
return view('users.show', ['user' => $user]);
}
Blade example
<head>
<!-- Styles -->
<link href="{{ asset(css/posts.css) }}" rel="stylesheet">
</head>
<body>
<div id="app">
#yield('content')
</div>
<!-- Scripts -->
<script src="{{ asset('js/posts.js) }}"></script>
</body>
I´ve just started using the Phalcon framework, I´ve read through most of the documentation described on their website but it´s still not clear to me how and where I need to include my css, and javascript files to showcase them on my view pages.
I'm currently maintaining the follow folder structure.
For example my assets folder contains all my css/javascript and jquery files how would I be able to include these in my index file.
I want to know where I could declare the path to find these specific files, and how I can include these files in my view.
You must declare it on your controller.
use Phalcon\Mvc\Controller;
class IndexController extends Controller
{
public function index()
{
// Add some local CSS resources
$this->assets->addCss("css/style.css");
$this->assets->addCss("css/index.css");
// And some local JavaScript resources
$this->assets->addJs("js/jquery.js");
$this->assets->addJs("js/bootstrap.min.js");
}
}
After this you can output your js and css link in the view:
<html>
<head>
<title>Some amazing website</title>
<?php $this->assets->outputCss(); ?>
</head>
<body>
<!-- ... -->
<?php $this->assets->outputJs(); ?>
</body>
<html>
Or you can use Volt syntax like this:
<html>
<head>
<title>Some amazing website</title>
{{ assets.outputCss() }}
</head>
<body>
<!-- ... -->
{{ assets.outputJs() }}
</body>
<html>
I'm trying to make an image gallery. I have one controller with two functions and every function load one view. When I call index I can watch images but when I call the other one (tg) I can't watch them.
Images are in a folder named imagenes and its path is example.com/codeigniter.
The controller:
class Galeria extends CI_Controller {
public function __construct()
{
parent::__construct();
}
public function index()
{
$this->load->view('vgaleria');
}
public function tg()
{
$this->load->view('tgaleria');
}
}
The default controller is this one.
The view that I can't watch images:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Galería de imágenes</title>
<style type="text/css">
</style>
<script src="<?php echo base_url();?>javascript/funciones.js"
language="javascript" input="type/text">
</script>
</head>
<body>
<div id="imgs">
<img src="imagenes/imagen1.jpg" id="eimg">
</div>
<input type="button" id="bant" onclick="imginter('arrancar')"
value="Arrancar">
</button>
<input type="button" id="bsig" onclick="imgparar()" value="Parar"></button>
</body>
</html>
How can I watch images?
Thanks.
Try this:
<img src="<?php echo base_url(); ?>imagenes/imagen1.jpg" id="eimg">
Would also depend if you have removed your index.php from the url using .htaccess. Otherwise use site_url().
I'm new in codeigniter, I feel trouble about layout/template/themes in codeigniter.
I don't know when should using one of them..
What is the best way that i can do? if i want to make a website with free a html/css template like
goodnatured
|--img
|--img01.jpg
|--css
|--style.css
|--js
|--jquery.js
|--index.html
Anyone can tell me a tutorial, suggest, ... thanks
I just write little additional library(application/libraries/display_lib.php) for rendering tempates and similar page blocks.
Something like this:
class Display_Lib{
private $_CI;
private $_template_data;
public function __construct()
{
$this->_CI =& get_instance();
}
public function set($key, $value)
{
$this->_template_data[$key] = $value;
}
public function get($key)
{
return $this->_template_data[$key];
}
public function get_template_data()
{
return $this->_template_data;
}
public function display_page($view, $data = array())
{
$this->set('content', $this->_CI->load->view($view, $data, TRUE));
$this->_CI->load->view('templates/main_template', $this->get_template_data());
}
}
Set this library in auto load:
$autoload['libraries'] = array('session', 'database', 'display_lib');
And call it in controller:
class Main extends CI_Controller{
public function index()
{
$some_data = array();
$this->display_lib->display_page('views/main_view', $some_data);
}
}
Template example:
<!DOCTYPE html>
<html lang="en">
<head>
<base href="<?=base_url();?>">
<meta charset="utf-8">
<link rel="icon" href="<?=site_url('img/favicon.ico')?>" type="image/x-icon"/>
<link rel="stylesheet" href="<?=site_url('css/style.css');?>" type="text/css" media="screen, projection"/>
<script type="text/javascript" src="<?=site_url('js/jquery-1.10.2.min.js');?>"></script>
<title>Some page title</title>
</head>
<body>
<header></header>
<div class="auth_wrapper">
<div class="content">
<?=$content;?>
</div>
<div class="buffer"></div>
</div>
<footer></footer>
</body>
</html>
And application/views/main_view simple exmaple:
<div>Come content will be here</div>
This lib allow to use templates and render views from controllers.
Templates handle the layout of your page. You create a template that will contain your meta, header, footer, and a space for the body. The body get injected in the template, this is where the content change.
The idea is that most of the site don't change, only the body changes. This is where templates are useful, they save you time and increase consistency.
See this template library, it's pretty good: http://getsparks.org/packages/template/show
Themes is combined with a template as templates often define the layout and a theme just 'skin' the layout. A theme include assets and styles that will modify the template further more.
Cheers
Make a template.php, header.php, footer.php. Below is template.php, Similarly make header and footer and place them all in views folder:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="icon" href="<?=site_url('img/favicon.ico')?>" type="image/x-icon"/>
<link rel="stylesheet" href="<?=site_url('css/style.css');?>" type="text/css" media="screen, projection"/>
<script type="text/javascript" src="<?=site_url('js/jquery-1.10.2.min.js');?>"></script>
<title>Some page title</title>
</head>
<body>
<header><?=$this->load->view('header');?></header>
<div class="wrapper">
<div class="content">
<?=$main?>
</div>
</div>
<footer><?=$this->load->view('footer');?></footer>
</body>
</html>
In your Controller function:
function index(){
$data = array();
$data['main'] = "home"; #this view is home.php in views folder, the content part of template.php
$this->load->view('template', $data); #this is the template file being rendered.
}
This is the most simple way of using templates in CI I think.