Hello,

I revised my previous discussion code by simplifying it.

controllers/page.php

<?php

class Page extends CI_Controller {

    public function index()
    {
    echo "Controller loaded";
    $this->load->view('homepage'); 
    }

}

?>

views/homepage.php

<!DOCTYPE html>
<html lang="en">

<head>
<link href= "<?php echo base_url('assets/css/style.css'); ?>" rel="stylesheet" type="text/css" media="screen"> 
</head>

<body>


TEST
</body>

</html>  

assets/css/style.css

$('body').css('background-image', 'url("<?php echo base_url('assets/images/indonusa3.jpg'); ?>")');  

RESULT:

Controller loaded

I wonder why the background image does not load. The following file does exist: assets/images/indonusa3.jpg . Also the text "TEST" does not appears if I add:

<link href= "<?php echo base_url('assets/css/style.css'); ?>" rel="stylesheet" type="text/css" media="screen">

in the html in homepage.php

assets is outside the application directory? What do you get from CI logs?

I think you have entered .js script in .css file.

If you want to add .css code then you have to write like this:

body
{
    background-image: url('../images/indonusa3.jpg');
}

or else you have to write your code in .js file

<script>
    $('body').css('background-image', 'url("<?php echo base_url('assets/images/indonusa3.jpg'); ?>")'); 
</script>

Hope this will help you

How to check th CI logs?

I only have one file appears in application/logs/index.html

<html>
<head>
    <title>403 Forbidden</title>
</head>
<body>

<p>Directory access is forbidden.</p>

</body>
</html>

I revise the style.css

body{background-image:url('../images/indonusa3.jpg'); background-repeat: repeat-x; background-position: center top; height: 800px;}

RESULT:

Controller loaded

(no background image) - I wonder why? There suppose to be a background image.

CI logs are enabled? In /application/config/config.php search and change log_threshold to 4:

$config['log_threshold'] = 4;

Then be sure that /application/logs/ is writable. After that just by reloading the page you should find a log file with information and, eventually, errors.

Also is assets directory outside of the application directory?

also, if you really want to put your css directory within the same level as the application directory, we can code the controller like this

<?php

class Page extends CI_Controller {

public function __construct(){

parent::__construct();

## load the url helper object
$this->load->helper("url");
}

public function index(){

## define the location of your css directory in reference to the application directory

$data['style'] = base_url().'assets/css/style.css',

$this->load->view('homepage', $data);
}
}

now your style.css can load the background image using this ../images/indonusa3.jpg

The homepage page should have ...

<head>
<link href= "<?php echo $style ; ?>" rel="stylesheet" type="text/css" media="screen">
</head>

That should do it for you...

How to create links to another views/ filename ? The image file already works. Now, those images must link to another views/ filenames.

homepage.php

<div id="products">
<a href="connection.php"><img src="<?php echo $connection; ?>"></a>
<a href="collaboration.php"><img src="<?php echo $collaboration ?>"></a>
<a href="solution.php"><img src="<?php echo $solution ?>"></a>
</div>

define the image directory and pass it on to the view side..

$data['images'] = base_url().'assets/images',

you can also send this to the header if you want, the view files can then use the url

<div id="products">
<a href="connection.php"><img src="<?php echo $images; ?>/connectionImage.jpg" /></a>

</div>

I think I have to use anchor to create the link:

views/homepage.php

<!DOCTYPE html>
<html lang="en">

<head>
<link href= "<?php echo $style; ?>" rel="stylesheet" type="text/css" media="screen">
</head>

<body>


<div id="products">
<a href="connection.php"><img src="<?php echo $connection; ?>"></a>
<a href="collaboration.php"><img src="<?php echo $collaboration ?>"></a>
<a href="solution.php"><img src="<?php echo $solution ?>"></a>
</div>


#assumed you want to link to a controller called "Connection"
<?php echo anchor('page/connection', '<img src="<?php echo $connection; ?>">') ?>;

</body>

</html>  

controllers/page.php

<?php

class Page extends CI_Controller {

    public function __construct(){

    parent::__construct();

    ## load the url helper object
    $this->load->helper("url");
    }

    public function index()
    {

    ## define the location of your css directory in reference to the application directory
    $data['style'] = base_url().'assets/css/style.css';
    $data['connection'] = base_url().'assets/images/connection.jpg';
    $data['collaboration'] = base_url().'assets/images/collaboration.jpg';
    $data['solution'] = base_url().'assets/images/solution.jpg';


    $this->load->view('homepage', $data); 
    }

    public function connection()
    {
    $this->load->view('connection'); 
    }

    public function collaboration()
    {
    $this->load->view('collaboration'); 
    }

    public function solution()
    {
    $this->load->view('solution'); 
    }

}

The anchor does not work yet. How to write the correct anchor code ? The images should like to another view pages.

these are good for the images and the css files..

 $data['style'] = base_url().'assets/css/style.css';
$data['connection'] = base_url().'assets/images/connection.jpg';
$data['collaboration'] = base_url().'assets/images/collaboration.jpg';
$data['solution'] = base_url().'assets/images/solution.jpg';

for the pages like connection.php, you can difine them like so..

'connectionUrl'=>base_url().'index.php/connection/';
'collaborationUrl' => base_url().'index.php/collaboration/';
'solutionUrl' => base_url().'index.php/solution/';

by doing so, you don't even have to write a route for those pages..except when pagination is utilized.

connection.php coltroller page example

Class Connection extends CI_Controller {

    function __construct() {
    parent::__construct();

    ## use only the model part if the content of the connection.php are coming from the database. Else, just leave it as is
    //$this->load->model('connection_model');

    $this->load->helper("url");

    }

    public function Connection(){

    //give this function a job

    //assign the return of this function to the view

    }

    }

Do the same to the remaining files.. Always create a model if the content is coming from the database..

CI naming standard for the model is similar to the controller's but it is a Pear style and not the Pascal style or camel style. This has to be named as connection_model.php

class Connection_model extends CI_Model {

public function __construct()
{
    parent::_construct();
    ## must load database module
    //$this->load->database();

}

public function someFunction(){

}
}

Parse error: syntax error, unexpected '=>' (T_DOUBLE_ARROW) in C:\xampp\htdocs\IndonusaCI\application\controllers\page.php on line 23

line 23: 'connectionUrl' => base_url().'index.php/connection/';

Then, how to create the views/homepage.php ?

Do you mean like this:

controllers/page.php

public function index()
    {

    ## define the location of your css directory in reference to the application directory
    $data['style'] = base_url().'assets/css/style.css';
    $data['connection'] = base_url().'assets/images/connection.jpg';
    $data['collaboration'] = base_url().'assets/images/collaboration.jpg';
    $data['solution'] = base_url().'assets/images/solution.jpg';

    $data['connectionUrl'] = base_url().'connection/';
    $data['collaborationUrl'] = base_url().'index.php/collaboration/';
    $data['solutionUrl'] = base_url().'index.php/solution/';


    $this->load->view('homepage', $data); 
    }

    public function connection()
    {
    $this->load->view('connection'); 
    }

views/homepage.php

<div id="products">
<a href="<?php echo $connectionUrl; ?>"><img src="<?php echo $connection; ?>"></a>

If I click the image, it will carries me to http://localhost/IndonusaCI/connection/

Object not found!

The requested URL was not found on this server. The link on the referring page seems to be wrong or outdated. Please inform the author of that page about the error.

If you think this is a server error, please contact the webmaster.
Error 404
localhost
Apache/2.4.3 (Win32) OpenSSL/1.0.1c PHP/5.4.7

Looks like I need routes.

these were wrong.. I didn't even realized it, until when you brought if up.

'connectionUrl'=>base_url().'index.php/connection/';
'collaborationUrl' => base_url().'index.php/collaboration/';
'solutionUrl' => base_url().'index.php/solution/';

correct way

'connectionUrl'= base_url().'index.php/connection/';
'collaborationUrl' = base_url().'index.php/collaboration/';
'solutionUrl' = base_url().'index.php/solution/';

You need to create a new page called connection, collaboration, and solution , in order for it to work.

You probably don't even need to route it. As long as you have pages in the controller directory, the CI autoloader will look for it.

I do have connection.php, collaboration.php and solution.php page.

How to code the:

views/homepage.php ?

<a href='connectionUrl'><img src="<?php echo $connection; ?>"></a>

Parse error: syntax error, unexpected '=' in C:\xampp\htdocs\IndonusaCI\application\controllers\page.php on line 23

Ok,... let's take care of this puppy once and for good.. I normally assign everything as an array, because it saves time and variables are easy to track and update. So, this example application will not be the same as what we could find on the web. By doing the same construct, it will be a lot easier to upgrade your CI with Smarty, Twig, or TinyButStrong package in the future.

controllers/page.php

<?php
class Page extends CI_Controller {

public function __construct(){
parent::__construct();
$this->load->helper('url');

}
public function index()
{
## define the location of your css directory in reference to the application directory

$data = array(
        'style' => base_url().'assets/css/style.css',
        'connection' => base_url().'assets/images/connection.jpg',
        'collaboration' => base_url().'assets/images/collaboration.jpg',
        'solution' => base_url().'assets/images/solution.jpg',
        'connectionUrl'=> base_url().'index.php/connection/',
        'collaborationUrl' => base_url().'index.php/collaboration/',
        'solutionUrl' => base_url().'index.php/solution/'

        );

$this->load->view('homepage', $data);
}

}

views/homepage.php

    <a href="<?php echo $connectionUrl; ?>"><img src="<?php echo $connection; ?>"></a>
<a href="<?php echo $collaborationUrl; ?>"><img src="<?php echo $collaboration ?>"></a>
<a href="<?php echo $solutionUrl; ?>"><img src="<?php echo $solution ?>"></a>

controllers/connection.php

class Connection extends CI_Controller {

public function __construct(){

 parent::__construct();
 $this->load->helper('url');

}
public function index(){



 $data = array(
            'connection'=>'Type your connection content here'
            );

 $this->load->view('connection',$data);


}

}

controllers/collaboration.php

class Collaboration extends CI_Controller {

public function __construct(){

 parent::__construct();
 $this->load->helper('url');

}
public function index(){



 $data = array(
            'collaboration'=>'Type your collaboration content here'
            );

 $this->load->view('collaboration',$data);


}

}

controllers/solution.php

class Solution extends CI_Controller {

public function __construct(){

 parent::__construct();
 $this->load->helper('url');

}
public function index(){



 $data = array(
            'solution'=>'Type your solution content here'
            );

 $this->load->view('solution',$data);


}

}

views/connection.php

<?php echo $connection;?>

views/collaboration.php

<?php echo $collaboration; ?>

Views/solution.php

<?php echo $solution; ?>

config/routes.php .. I guess we should create a route, so that we are looking at the same application.

$route['collaboration'] = 'collaboration';
$route['connection'] = 'connection';
$route['solution'] = 'solution';

That's it....

Thanks. Now it works.

One more thing: how to pass the url link to the css file. style.css for example?

In my style.css I have (a few image files link):

body{background-image:url('../images/indonusa3.jpg'); background-repeat: repeat-x; background-position: center top; height: 200px;}

#navigation {background-image:url('../images/nav.jpg'); background-repeat: repeat-x; width: 900px; height: 80px; z-index: 2; border-radius: 10px; border-style:solid; border-width: 1px; border-color: gray; margin-left: auto; margin-right: auto; margin-top: 50px;}

Nevermind, it works. I can just keep it the way it is.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.