Ideas on how to set up a front page

31 Posts

tropicaljuice Reply #1, 15 years, 1 month ago

Hi, there.

I having some trouble setting up our front page, as I have no idea on how to make it simple..
Look at this example:
http://themeforest.net/item/curio-clean-creative-website-template/full_screen_preview/503953

How would you guys set up all the parts on this page?

In a previous template I bought, i used get resources to manage the slider. I created a container named "resources" and then a container under there named "slides". For every static resource added with a image TV, it will create a new slide.
web
web-->Resources
web-->Resources-->Slides
web-->Resources-->Slides-><And put all slides here>

For for one, is this the best way to do it or is there any other way?

And the second
How would you design both of the rows with three boxes? As they are static boxes and the last box have a extra addition on the div tag, I cant use get resources to list them up, and therefore need to have three documents that the users need to change (not create new ones).
But is there any better way to solve this?

Hope for some help here..

Best regards

31 Posts

tropicaljuice Reply #2, 15 years, 1 month ago

And one more thing: Lets say we have more pages with sliders.. Then it will be a complete mess if we have the slides in resource container..

And if we put a container in every page that have a slider, how will the users know what is is? Because it will for sure blend right in with all the other sub-pages..

5,888 Posts

Bruno17 Reply #3, 15 years, 1 month ago

you can try MIGX

-------------------------------

you can buy me a beer, if you like MIGX

http://webcmsolutions.de/migx.html

Thanks!

☆ A M B ☆
24,524 Posts

sottwell Reply #4, 15 years, 1 month ago

That is one of the benefits of using Evo and QuickManager. You can put a special HTML comment in the Ditto tpl to provide an edit button for each element of a list.

I handle it as you did; a resource for each element of the slider or accordion or whatever needs to be displayed using Ditto, and each element has its own edit button that opens that element's resource for editing.

I also can add a QuickManager main menu item for creating new items. This is very useful for something that gets updated a lot like a list of "our people", with a JQuery accordion to show/hide the bio and image.

The client has a limited Manager user login that lands him on the home page, and he can go from there.

I don't think there is an equivalent front-end manager application for Revo yet; or at least not one with these features.

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

31 Posts

tropicaljuice Reply #5, 15 years, 1 month ago

Thanks for the help, I’m getting closer here now.

This template has 5 different slides.

I want a category in the TV's:
- Slides

In the slides category, there is no default selection and it’s not forced. Here you can choose what kind of slide-layout you want to use.
It is also only available to the “Frontpage” template.

And when a slider is selected, MODx places some code in the theme.
This may be easy for you guys who understands TV. I don’t know how to do this. I have read this guide: http://wiki.modxcms.com/index.php/Create_TV-Based_Chunks , but I can’t get the dropdown to work. Only the checkmark to list _all_ chunks in the chunk-category.

But here is the tricky part. The sliders are defined with document under a _resources container (the _resource container is under the page using it, so it can’t rely on document ID), and in the html source, they have some CSS and Javascript in the header, as well as the template itself under the body part of the site.

How can this be solved in a way that it’s manageable by the End-user?

Please look at the attached image of the tree-layout.

This is what I know how to do:
- Create a basic TV only available to certain templates
- Create a static slider-template using getResouces and with a chunk-template who list up all slides under a certain document ID. [ed. note: tropicaljuice last edited this post 15 years, 1 month ago.]

31 Posts

tropicaljuice Reply #6, 15 years, 1 month ago

Just look at this HTML code.
Oh my god, i have no idea how to even start with this slider...

			<div class="slider_new_2">
				<div id="slider">
					<img src="temp/images/gallery/full/28.jpg" alt="" title="#htmlcaption2"/>
					<a href="#"><img src="temp/images/gallery/full/2.jpg" alt="" title="#htmlcaption" /></a>
					<img src="temp/images/gallery/full/3.jpg" alt="" title="#htmlcaption2" />
					<img src="temp/images/gallery/full/26.jpg" alt="" title="#htmlcaption2" />
					<img src="temp/images/gallery/full/27.jpg" alt="" title="#htmlcaption2" />
					<img src="temp/images/gallery/full/22.jpg" alt="" title="#htmlcaption2" />
				</div>
				<div id="htmlcaption" class="nivo-html-caption">
					<h4 class="gallery_caption_title">Lorem Ipsum Dolor</h4>
					<p>Lorem ipsum dolor sit amet.</p>
				</div>
				<div id="htmlcaption2" class="nivo-html-caption">
					<h4 class="gallery_caption_title">Lorem Ipsum Dolor</h4>
					<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magn. <a href="#">Read More</a></p>
				</div>
			</div>

☆ A M B ☆
24,524 Posts

sottwell Reply #7, 15 years, 1 month ago

1. Create your resources with title content and a TV for the image.

2. Have Ditto (or getResources) calls, one in the slider div that just generates the image tags, and the second one generates the nivo-html-caption divs.

http://deafbusiness.org/

<div class="slider_new_2">
<div id="slider">
[[Ditto? &parents=`42` &tpl=`sliderTpl`]]
</div>
[[Ditto? &parents=`42` &tpl=`captionsTpl`]]
</div>

Studying MODX in the desert - http://sottwell.com
Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
Join the Slack Community - http://modx.org

☆ A M B ☆
894 Posts

benmarte Reply #8, 15 years, 1 month ago

If your using Revo then NivoGallery does all this using the Gallery extra.

You could probably do the same with EVOs Gallery as well.

Benjamin Marte
Interactive Media Developer
Follow Me on Twitter | Visit my site | Learn MODX