How do i link to template path folder?

Everything to do with Joomla! 3.x templates and templating.

Moderator: General Support Moderators

Forum rules
Forum Rules
Absolute Beginner's Guide to Joomla! <-- please read before posting, this means YOU.
Forum Post Assistant - If you are serious about wanting help, you will use this tool to help you post.
Post Reply
shaibustephen
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 172
Joined: Sat Nov 17, 2018 1:52 pm

How do i link to template path folder?

Post by shaibustephen » Fri Jun 28, 2019 9:32 pm

Wordpress has header folder where the header.php has something like below.

Code: Select all

	<header id="masthead" class="site-header" role="banner">

		<?php get_template_part( 'template-parts/header/header', 'image' ); ?>

		<?php if ( has_nav_menu( 'top' ) ) : ?>
			<div class="navigation-top">
				<div class="wrap">
					<?php get_template_part( 'template-parts/navigation/navigation', 'top' ); ?>
				</div><!-- .wrap -->
			</div><!-- .navigation-top -->
		<?php endif; ?>

	</header><!-- #masthead -->
How do i achieve this in joomla? I want to break my joomla template structure to sections/block and each section/block will be in a folder and in this way i want link path to it and only url folder links path to show only in the index.php. ts.framework has similar thing i am talking about as:

Code: Select all

  <?php $this->loadBlock ('header') ?>
    
    <?php $this->loadBlock ('mainnav') ?>

    <?php $this->loadBlock ('spotlight-1') ?>

    <?php $this->loadBlock ('mainbody') ?>
    
    <?php $this->loadBlock ('spotlight-2') ?>
    
    <?php $this->loadBlock ('navhelper') ?>
    
    <?php $this->loadBlock ('footer') ?>
Take for instance
header folder
navigation folder
home page folder
carousel folder
footer folder etc

User avatar
john-doe
Joomla! Guru
Joomla! Guru
Posts: 909
Joined: Tue Apr 19, 2011 7:39 pm
Location: Colombia
Contact:

Re: How do i link to template path folder?

Post by john-doe » Wed Jul 03, 2019 4:16 pm

Sounds like you are trying to adapt a Wordpress Theme to Joomla Template.

Normally the Joomla template structure unlike Wordpress gathers everything, header, body and footer an one file index.php.

Since i have done the excercise of adapting an HTML design to both Joomla and Wordpress i could say a couple of things about it:

First and Foremost, set up the positions in the index.php as a single file (this is most recomemendable in custom Joomla sites). The positions as you mention as:

Code: Select all

<?php $this->loadBlock ('mainnav') ?>
in Joomla are set as

Code: Select all

<jdoc:include type="modules" name="mainnav" style="html5" />
The main body varies according to the component:
If you want to set the component content like

Code: Select all

<?php $this->loadBlock ('mainbody') ?>
The correct position in Joomla is:

Code: Select all

<jdoc:include type="message" />
<jdoc:include type="component" />
Where message corresponds to the system messages in the fronend and component corresponds to the component itself (e.g. article, category, featured articles, contact form, and so on)
If you need that a module component appears only when the module is populated the syntax is:

Code: Select all

<?php if($this->countModules('MyModule')) : ?>
  <jdoc:include type="modules" name="MyModule" style="html5" />
<?php endif; ?
Where the if clause asks that is present content in the module position.

Then in the file templateDetails.xml you need to list the positions in order that Joomla recognize them.

Code: Select all

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE install PUBLIC "-//Joomla! 2.5//DTD template 1.0//EN" "http://www.joomla.org/xml/dtd/2.5/template-install.dtd">
<extension version="3.1" type="template" client="site">
	<name>MyWPTemplate</name>
	<version>1.0</version>
	<creationDate>31/12/1969</creationDate>
	<author>Your Name</author>
	<authorEmail>your@e-mail.com</authorEmail>
	<copyright>Copyright (C) 2005 - 2014 Open Source Matters, Inc. All rights reserved.</copyright>
	<description>Template Description</description>
	<files>
		<filename>favicon.ico</filename>
		<filename>index.php</filename>
		<filename>index.html</filename>
		<filename>templateDetails.xml</filename>
		<filename>template_preview.png</filename>
		<filename>template_thumbnail.png</filename>
		<folder>css</folder>
		<folder>html</folder>
		<folder>images</folder>
		<folder>fonts</folder>
		<folder>js</folder>
		<folder>sections</folder>
	</files>
	<positions>
		<position>mainnav</position>
		<position>spotlight-1</position>
		<position>spotlight-2</position>
		<position>navhelper</position>
		<position>footer</position>		
	</positions>
</extension>
Main Component by default is shown so there is no need to establish it in the XML file.

Other details like galleries and carousels can be done via template overrides. you can find about this in this URL https://docs.joomla.org/How_to_override ... omla!_core

Now the hard part, Split it, which i never tried before since i had no need to do so.

You need to have an index.php on your template Root. In there you need to set before the Doctype at least these statements

Code: Select all

<?php 
defined( '_JEXEC' ) or die( 'Restricted access' );
$doc = JFactory::getDocument();
$this->language = $doc->language;
$this->direction = $doc->direction;
?>
<!doctype html>
<html>
<head>
<jdoc:include type="head" />
</head>

<body>
<!--the rest of the html-->
(The following proposal is untested however i used a bit of the proposed php content to add a segment within the file in some templates)
Now what you need to split the parts to be gathered in the index.php in the php you might set the positions inside the html file. Remember to test the index.php as a whole page first before to split, to verify that content positions are working.

Now the theoretical proposal

Code: Select all

<?php 
defined( '_JEXEC' ) or die( 'Restricted access' );
$doc = JFactory::getDocument();
$this->language = $doc->language;
$this->direction = $doc->direction;
?>
<!doctype html>
<html>
<head>
<jdoc:include type="head" />
</head>

<body>
<header>
<?php include_once("/templates/MyTemplate/sections/header.php") ?>
</header>
<main>
<jdoc:include type="message" />
<jdoc:include type="component" />
</main>
<footer>
<?php include_once("/templates/MyTemplate/sections/footer.php") ?>
</footer>
</body>
</html>
And each of the sections as php files should have the content like this:

Code: Select all

<?php
echo "<!--content of the inside of header tag above> <jdoc:include type="modules" name="mainnav" style="html5" /><!--content of the inside header below--> "
?>
Hope this helps.
www.aldemar-hernandez.com - Custom templates and design services.

shaibustephen
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 172
Joined: Sat Nov 17, 2018 1:52 pm

Re: How do i link to template path folder?

Post by shaibustephen » Sat Sep 28, 2019 10:24 am

I appreciate your answer. Please I have little problem on how to create dynamic carousel slide.

I actually know how to create carousel slider using custom module but I want I am not getting it from such.

How do I customize the home page lead feautured (feautred.php) such that any latest post will automatically display as slide show.

I look deaply on the featured.php on how to get this done but get stocked on how to have carousel-item active, carousel-item to make it possible if I want to have three or four featured page slider.

How do I go about it?

User avatar
Per Yngve Berg
Joomla! Master
Joomla! Master
Posts: 26138
Joined: Mon Oct 27, 2008 9:27 pm
Location: Akershus, Norway

Re: How do i link to template path folder?

Post by Per Yngve Berg » Sat Sep 28, 2019 11:11 am

Probably something you can use here.: https://extensions.joomla.org/category/news-display/

https://docs.joomla.org/Layout_Overrides_in_Joomla

You can make a Bootstrap carousel if you load Bootstrap in your template.
https://getbootstrap.com/2.3.2/javascript.html#carousel

shaibustephen
Joomla! Enthusiast
Joomla! Enthusiast
Posts: 172
Joined: Sat Nov 17, 2018 1:52 pm

Re: How do i link to template path folder?

Post by shaibustephen » Sat Sep 28, 2019 4:01 pm

To do override is not the problem but my concern is how to have carousel-item active and carousel-item

diaz365
Joomla! Apprentice
Joomla! Apprentice
Posts: 22
Joined: Thu Oct 03, 2019 3:41 pm
Contact:

Re: How do i link to template path folder?

Post by diaz365 » Wed Oct 16, 2019 5:59 pm

link to image: dymanic
<img src="templates/<?php echo $this->template ?>/images/color swatches.png" width="282" height="149" />

"templates/" is the folder. where all the templates are.
this is current template name <?php echo $this->template ?>
images/ is the images folder.


Post Reply

Return to “Templates for Joomla! 3.x”