TV usage/scope in template (or can you have too many TVs)

10 Posts

pwalrath Reply #1, 14 years, 8 months ago

Hello everyone,

I’m new to MODx and really appreciate all the development work that has been done. It is really an excellent system.

I have a very basic question about MODx and the appropriate use of Template Variables (TV) and Templates (what you create in Elements -> Manage Elements -> Templates). I understand that you create a TV and then assign that TV to one or more templates. When editing documents using those templates, you’ll see widgets for viewing/setting these TVs.

I got that part.

In my mind, I feel I should be group TVs together depending on the context of the document. Let me illustrate with an example: let’s suppose I’m building a store website. I may have:

static pages that talk about the store (so, no TVs used here, or maybe just something for sidebar content. Whatever.)
dynamic-content pages for my products (so, that means a few TVs for product price, ID#, etc.)
other dynamic pages, unrelated to my products pages (where I may want to use other, unrelated TVs)

Since there’s a whole set of TVs that only apply to the product pages, I feel this urge to separate these TVs into their own container. Perhaps create a different MODx template and assign my product TVs to that "product template" only. That way, when I’m in the context of creating some other static page or unrelated dynamic-content page, I’m not seeing these product-TVs that have absolutely no application in that non-product context.

And yet, duplicating a template just for the sake of grouping TVs according to context seems awkward. If I intend to have the same look over the whole site (static and dynamic pages alike), shouldn’t I be using just one template?

I’m confused. Help me understand: what is the MODx best practice for a situation like this?

Thanks in advance.

372 Posts

bwente Reply #2, 14 years, 8 months ago

Welcome to MODx!

You certainly grasped the concept and explained it beautifully. (Are interested in writing documentation for MODx?)

I have a different template for each different type of page anyway, I do not have any "global" template variables. In fact my template pages are very small with lots of chunks.

There is a snippet called ManagerManager that will allow you to create additional tabs. You could use it manage your TV’s that way. It does not work with 2.0

DropboxUploader -- Upload files to a Dropbox account.
DIG -- Dynamic Image Generator
gus -- Google URL Shortener
makeQR -- Uses google chart api to make QR codes.
MODxTweeter -- Update your twitter status on publish.

10 Posts

pwalrath Reply #3, 14 years, 8 months ago

Quote from: bwente at Sep 09, 2009, 01:04 AM

I have a different template for each different type of page anyway, I do not have any "global" template variables. In fact my template pages are very small with lots of chunks.

Ok. That makes sense.

Previously, I had thought that I was only going to need one MODx template for my website, since I wanted all the pages in my site to have the same look. But if I understand correctly, it’s perfectly alright to have multiple MODx Templates for different contexts in the website -- even if you want the pages to have the same look and feel when they’re displayed in the browser. The different templates have the same HTML content, but only the TVs appropriate for one template’s context are assigned to that one template.

I suppose if I wanted to avoid duplicating the HTML that makes up the various templates, I could do the following:

create a chunk (say [tt]site_html_template[/tt]) to store the HTML "template". That is, just the HTML code that makes up the site.
Create the MODx templates I need for my various site contexts

template code

MODx is so modular! Very neat. Thanks for your help.

You certainly grasped the concept and explained it beautifully. (Are interested in writing documentation for MODx?)

Actually, I would be interested in writing documentation for the MODx project at some future time. I think once I understand the MODx system better, I would like to contribute to the documentation (or code, for that matter). But that’s getting ahead of myself! Right now, I’m still just getting started.

372 Posts

bwente Reply #4, 14 years, 8 months ago

I usually paste in my complete html into a template, then replace with chunks and snippets. Most designs lend themselves to type of approach. I will select an area that is common to all sections and cut it out and replace it with a {{chunk}}. Sometime I take the DIV with the chunk sometimes it is the content inside.

Here is one of my templates. DISCLAIMER: Sometimes in the rush to a site working, I might not clean things up as nicely as I should, but it is normally for my eyes only.

<!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" xml:lang="en" lang="en">
<head>
<base href="[(site_url)]" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>[(site_name)] | [*pagetitle*]</title>

	<link rel="stylesheet" type="text/css" media="all" href="[(base_url)]assets/templates/REPS/css/960/reset.css" />
	<link rel="stylesheet" type="text/css" media="all" href="[(base_url)]assets/templates/REPS/css/960/text.css" />
	<link rel="stylesheet" type="text/css" media="all" href="[(base_url)]assets/templates/REPS/css/960/960.css" />
	<link rel="stylesheet" type="text/css" media="all" href="[(base_url)]assets/templates/REPS/css/site.css" />
	<link rel="stylesheet" type="text/css" media="all" href="[(base_url)]assets/templates/REPS/css/default.css" />
	
    <link rel="shortcut icon" href="/favicon.ico" />
</head>

<body>
<div id="wrap">
<div id="content">
<div id="header">
	<div class="container_12 clearfix">
			<div id="topheader" class="grid_12">
				{{topheader}}
			</div>
	</div>
	<div class="container_12 clearfix">
		<div class="grid_7">
			<div id="intro">
				<p>logo area</p>
			</div>
		</div>
			<div id="editarea" class="grid_5">
				<div id="special">
					[!Ditto? &documents=`22` &tpl=`blockContent`!]
				</div>
			</div>	
	</div>
</div>
	<div class="container_12 clearfix">
		<div class="grid_12 mainbody">
		<div class="grid_7 alpha">
				<div class="grid_7 alpha">
					[[Wayfinder? &startId=`3` &excludeDocs=`25` &outerTpl=`outerTPL` &rowTpl=`rowTPL`]]
				</div>
		<div class="grid_6">
		<div class="content">
			<h2>[*pagetitle*]</h2>
			[*content*]
		</div>
		</div>
	</div>
		<div class="grid_4 omega">
			<div id="sidebar">
				{{newsblock}}
				<div id="offers">
					[!Ditto? &documents=`21` &tpl=`blockContent` &showPublishedOnly=`0`!]
				</div>
				{{accountInfo}}
			</div>
		</div>
	</div>
	</div>
	<div class="container_12 clearfix">
		<div id="footerarea" class="grid_12">
			<div id="footer">
				[[Wayfinder? &startId=`3` &level=`1` &outerTpl=`outerTPLbottomSR` &rowTpl=`rowTPLbottomSR`]]
			</div>
		</div>
	</div>
</div>
</div>
</body>
</html>

DropboxUploader -- Upload files to a Dropbox account.
DIG -- Dynamic Image Generator
gus -- Google URL Shortener
makeQR -- Uses google chart api to make QR codes.
MODxTweeter -- Update your twitter status on publish.