OpenCart 2.3 - New Theme, where CSS files shall be applied? - opencart

I am developing a new custom theme for OpenCart 2.3 and following book tutorial.
I am reading header.tpl in OpenCart 2.3 and I see these lines of code:
<?php foreach ($styles as $style) { ?>
<link href="<?php echo $style['href']; ?>" type="text/css" rel="<?php echo $style['rel']; ?>" media="<?php echo $style['media']; ?>" />
<?php } ?>
Which obviously is loading additional CSS files.
If I have a couple of CSS files to be applied in this custom theme, where should those files be specified?
I understand that I can use:
<link href="...css" rel="stylesheet" type="text/css"/>
but, is there any other way or place to add them?

In the header controller, add:
$this->document->addStyle('your-stylesheet.css');
your-stylesheet.css should be located here:
/catalog/view/theme/default/stylesheet/your-stylesheet.css

Related

adding "static" to many entries in a DJango html file

I need to add the "static" feature to a number of files in my DJango project as mentioned here: howto: static files
It seems to work. But, the instruction says that one needs to make this change
OLD:
<img src="my_app/example.jpg" alt="My image"/>
NEW:
{% load static %}
<img src="{% static 'my_app/example.jpg' %}" alt="My image"/>
to every line that needs it.
I have several hundred lines of already-existing code that is in the old format. How can one change so many lines so at one time so that they will be in the correct format? In "vi", one can use something like:
:1,$ s/static/{% static '/
but that would only take care of the left-hand-side. The right-hand-side would still need: ' %"} . The files being used are sometimes .css, .jpg, .png, and others.
TIA
Here is a sample:
<link href="/static/wforms/assets/global/plugins/bootstrap-daterangepicker/daterangepicker.min.css" rel="stylesheet" type="text/css" />
<link href="/static/wforms/assets/global/plugins/morris/morris.css" rel="stylesheet" type="text/css" />
<link href="/static/wforms/assets/global/plugins/fullcalendar/fullcalendar.min.css" rel="stylesheet" type="text/css" />
<link href="/static/wforms/assets/global/plugins/jqvmap/jqvmap/jqvmap.css" rel="stylesheet" type="text/css" />
[... snip ...]
<div class="mt-avatar">
<img src="/static/wforms/assets/pages/media/users/avatar80_1.jpg" />
</div>
[... snip ...]
Update
#SLePort - thanks for the answer. For my situation, just made a few changes:
The "sed" script creates the result so that - on the right-hand-side - one gets
%} and not %} " (with the extra quote on the end) - see example below
<link href="{% static "wforms/assets/global/plugins/font-awesome/css/font-awesome.min.css" %} rel="stylesheet" type="text/css" />
<link href="{% static "wforms/assets/global/plugins/simple-line-icons/simple-line-icons.min.css" %} rel="stylesheet" type="text/css" />
So, I just ran
:1,$ s/%}/\'%}/g
in the vi editor and all was fine.
Thanks again!
With sed, you can use backreference and the -i flag to edit you file in place:
sed -i 's|="/static/\([^"]*\)"|="{% static "\1" %}|' file
the solution for me is to apply a regex using some text editor. Use replace:
my_app
for:
{% static 'my_app
and for the final bit:
jpg
for:
jpg' %}
If you use linux, gedit or xed. In windows notepad++ is a good choice for these things.(Or your code editor sure has the function replace)
Edit
Komodo edit lets you replace in different files at the same time.
Hope it helped.
Edit 2
Here are the regexp that seem to work:
(href="|src=")
replace with
\1\2{% (adjust this as you need)
The last part:
(jpg|\.css)
replace with
\1\2' %}

how to properly define two similar layouts for cakephp

I'm using CakePHP 2.2.4 and have similar layouts. For one page, however, the <head> content is the same, but essentially the whole body is different. What I have is a website with a navbar used from twitter's bootstrap. On this one page, the navbar is completely different. I know the quick fix would be to create a layout for just that page, but what if I come across another page I need to make with a different navbar? What would be the "proper" MVC way of doing this?
If every view will have a navbar of some kind, then you can just use CakePHP Elements to display the bar, you would put the element call in your one layout file and set a variable from the controller which you pass to the element to show a specific element...
echo $this->element('navbar', array(
"which_element" => "thisone"
));
In the above example, your navbar.ctp would have to contain all navbars and use a PHP Switch statement or something to work out which to display based on the $which_element...
Or better still, just call the element directly using the variable from the controller
$this->set('navbar', "thisone"); // this line is in your controller and sets the file name of your nav bar, minus the .ctp extension
echo $this->element($navbar); //this line is in your layout.ctp and renders elements/thisone.ctp, in the above example.
If some pages will have a nav bar but some will not, use View Blocks
$this->start('navbar');
echo $this->element($navbar);
$this->end();
I guess it depends how complex the differences are.
One way to go would be to have a common layout file
// in app/View/Common/layout.ctp
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Your header content -->
</head>
<body>
<div id="wrap">
<div class="navbar">
<?php echo $this->fetch('menu'); ?>
</div>
<div class="container">
<?php echo $this->fetch('content'); ?>
</div>
</div>
<div id="footer">
<?php echo $this->fetch('footer'); ?>
</div>
</body>
</html>
Have your layout file extending it
//app/View/Layouts/default.ctp
<?php
$this->extend('/Common/layout');
$this->assign('menu', $this->element('menu'));
echo $this->fetch('content');
$this->assign('footer', $this->element('footer'));
?>

What is the best way to load my own xhtml template in Codeigniter?

I'm new in Codeigniter, and I wonder how can I load my own XHTML template to be used, I was working on CakePHP earlier and it was pretty easy to add own template in Cake, but I switched to the Codeigniter, since I've read it's a lot better and has a 'better future'. I was searching on wiki, but tutorials there was providing not enough information for me.
put public folders in root directory,
index.php
application/
system/
images/
js/
css/
now include js like this: <script src="<?php echo base_url();?>js/jquery.js"></script>
for css: <link href="<?php echo base_url();?>css/style.css" rel="stylesheet" type="text/css" />
and for images: <img src="<?php echo base_url();?>images/1.jpg" />
the fastest and simplest way of display page, is as follows:
in controller:
$data['body'] = "welcome";
$this->load->view('page', $data);
now create page.php inside the view folder:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es">
<head>
<title>Template codeigniter</title>
<script src="<?php echo base_url();?>js/jquery.js"></script>
<link href="<?php echo base_url();?>css/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div>
<?=$body?>
</div>
<div class="clear"></div>
<div>Footer</div>
</div>
</body>
</html>
Loading templates is best described in the CI doc regarding templates.
http://codeigniter.com/user_guide/libraries/parser.html
$this->load->library('parser');
$data['val1'] = 'some string';
$data['val2'] = 2012;
$this->load->view('my_xhtml', $data);
Now, in your template, you will have PHP vars of $val1 & $val2 you can use in dynamic elements of your html.

How to tell Facebook what images to offer a user when posting a link to my web page? [duplicate]

This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
How does Facebook Sharer select Images?
When a user posts a link to my webpage to share on Facebook, Facebook scans my webpage/site and offers up some images found in that page. The user selects one to associate with the fb post.
Can I control which images on my web page facebook will offer up to the user to use in a post?
A feature that looks close is Open Graph Tags, http://developers.facebook.com/docs/opengraph/ , but it doesn't seem to suffice my particular need as it seems to allow just one image to represent that page.
Yes, you can do this by generating a "super proxy" this will create based on dynamic information your application provides the meta data needed by facebook sharer, you can check this working on this link: http://concursos.genommalab.com/soyflaca/ I made this website and since all the content comes from a single page to share every one of the items has a customize one I used a deep link technique and send it to my super proxy that generated the static content to the facebook sharer.php, here is the code:
<?php
// get our URL query parameters
$current_path = 'http://' . dirname($_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']);
$title = $_GET['t'];
$diet_id = $_GET['diet_id'];
$desciption = $_GET['desc'];
$image_thumb = $_GET['thumb'];
$shared_url = $_GET['surl'];
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title><?php echo $title;?></title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="title" content="<?php echo $title;?>" />
<meta name="description" content="<?php echo $desciption;?>" />
<meta http-equiv="refresh" content="1;URL=<?php echo $current_path . '/#diet_' . $diet_id; ?>" />
<link rel="<?php echo $image_thumb; ?>" />
</head>
<body>
<img src="<?php echo $image_thumb; ?>" alt="<?php echo 'Imagen de ' . $title; ?>" width="112" height="112" style="visibility: hidden;"/>
</body>
</html>
Or perhaps all you want to do is add a list of images available to facebook, like this...
<link rel="images/example_1.jpg" />
<link rel="images/example_2.jpg" />
<link rel="images/example_3.jpg" />
<link rel="images/example_4.jpg" />
<link rel="images/example_5.jpg" />
Right inside <head> </head> tags. Remember this are scanned by facebook sharer.php

Joomla change favicon jdoc

I have two questions:
a) How can i acess Joomla template's folder in the website so i can see where some images are placed and replace it.
b) How do i change my template's website favicon ? Website head is something like this:
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" /
</head>
The favicon part is inside the "jdoc: include", which i don't know how to acess it. I would like some help on how to acess here to change favicon.
The answer to both questions is to look in the /templates folder. That folder contains a series of folders that represent the templates on your system. If you want to change where your images are stored, you will need to update the template you are using to point to the new location.
The directive has built into it instructions to display the favicon.ico file that is located in your active template folder. So you don't really need to change the location of the favicon, just put the image you want to display in your template folder and name it favicon.ico
a) Use ftp-cliet to browse your site folders. For example filezilla.
b) No favicon isn't assigned inside <jdoc:include type="head" />. If it is not assigned explicitly, default favicon is used. In your template after code you have posted add following code
<link href="<?php echo $this->baseurl ?>/templates/__your__template_folder__/favicon.ico" rel="shortcut icon" type="image/x-icon" />
and upload image favicon.ico into your template folder.
I hope it will be helpfull.