Login

belotte · 2013-09-14, 03:45:25

Hello to all you smart theme developers Big Grin

I'm hopping some one can help me out.

I am trying to develop a page in my theme that will be a "bio" page. It will have an image of the person to the right and their biography (text) to the left (and may wrap to the bottom if there is enough text).

The page will have multiple bios though, one atop another with some margin in between.

It also needs to be a main page off the top nav not a sub page.

Here's where it get's tricky though. I want the text, and the images to be easily editable in an admin editor.

This is a project for a friend who will be maintaining the site them selves and they don't know any thing about html, css, php, etc. So it's got to be as simple as possible.

I can't figure out if there's a plugin or even a basic feature of GS that will allow this. I could code it the way I normally would but then it's too complicated for him to maintain.

Thanks in advance.

Richard

**Timbow** · 2013-09-14, 20:51:56

I don't have a single answer for you but it would seem that these are your options.

There is a Item Manager Plugin (not the old abandoned one) which is recent and might just do the job. I haven't used it.
You can make your own arrangement with Special Pages and Custom Fields plugins.
Use News Manager or Pages Blog to make a page which displays Team Bios as 'posts'.
Write some css for just that page so that it is really easy to add bios as li or td with the formatting already determined and the images already floated with the right margins etc. You just need <body id="<?php get_page_slug(); ?>" > in your template if it isn't already there.

I would be interested to know how you get on. It's a common task, to list team members, or upcoming events, or past publications, or products, or links and sites or whatever in a regular format and easy do update.

belotte · 2013-09-16, 16:09:16

Hello Timbow.

Thanks for responding. Yes, I would have though it would have been easy as well. But so far... not.

The item manager (as I understand it) is for managing down loads, not for creating pages.

I've tried the special pages and custom fields plugins. The special pages plugin doesn't allow creating a page that's not a sub-page of another.

The custom fields plugin (though I must admit I don't fully understand this one), seems to be more for making custom fields in the admin panel.

I tried using a blog plugin... but that didn't work either. It wouldn't allow me to style the blog posts.

I did create a styled page that works (css, html, etc), but it completely bypasses the CMS, which kindof defeats the purpose.

Where I'm at now I think, is to put a tone of classes in the style sheet. Then he'll have to go into the source code after he ads the content and put the classes in. Not exactly the easiest system, especially for some one who doesn't know html / css / php and doesn't really want to learn. Kind of sucks but I don't know what else to do at this point.

hameau · (This post was last modified: 2013-09-16, 18:36:01 by hameau.)

(2013-09-16, 16:09:16)belotte Wrote: The special pages plugin doesn't allow creating a page that's not a sub-page of another.

You can make a top-level page with Custom Pages. Just leave the 'Page Parent' field blank and it defaults to '--None--' when you create a page. (Don't be misled by the instructions text at the side of the 'Page Parent' field – 'must be selected' would be better translated as 'can be selected'.)

For your original question, I suggest:
- Custom Pages to make a layout and page entry form for each bio;
- I18N Search to render the Bio page.

You can set a tag for bio pages, then use the search to make a page from those tagged pages. The bio pages can be set to not show in the menu.

I use this method to produce the Catalogue page for one of my clients: http://www.pimentastique.com/catalogue. Each catalogue entry is on a Custom Page and the tag is preset to _catentry. The actual page 'Catalogue' consists of the title and first paragraph, followed by the search term:

Code:
(% searchresults order=url tags=_catentry max=6 showPaging=1 HEADER="" %)

(Incidentally, the sidebar links are also generated with I18N Search on that site.)

You will have to invest some time in learning Custom Pages and you will have to write some HTML and possibly PHP. It is quite basic, but not all GUI driven.

**Timbow** · 2013-09-16, 19:15:45

Here is the example I was thinking of done with cumbe's Pages Blog. I don't think it is in Extend.
http://cumbe.260mb.org/blog/style-news/

That's the right kind of format, no?

I need to sort out another site with a schedule of events which I want to do like this.

datiswous · 2013-09-17, 05:26:18

Maybe you can use this plugin:

http://get-simple.info/extend/plugin/sim...-tabs/523/ (I don't know how it will work with the newest version of GS (last forum update on that plugin is from June).

Then you need something for the images.

A simple input tab with only an image?
An image gallery with one image present?

Btw. Is this a theme-look similar to what you want:

http://www.thomashardy.me.uk/cv/

belotte · 2013-09-23, 13:13:14

Hello there.

Thanks for all the help. Unfortunately I don't think any of these solutions work.

hameau: I am not using a search. I just want a page with listings.

Timbow: http://cumbe.260mb.org/blog/style-news/ this is almost exactly what I am talking about (I want it even simpler though, picture on right and text on the left).

datiswous: As interesting as this would be, again I just want a simple list; no tabs.

A simple <ul> would be great. I could do each listing as an <li>. I would just use classes to place the text and the images. But then the question is how do I set the back end so it is easy for the admin to just ad the content with out going into the html.

This is the question I am trying to solve.

Quite frankly I don't understand why it's so difficult. You would think an unordered list with admin interface would be baked in.

datiswous · (This post was last modified: 2013-09-23, 19:21:36 by datiswous.)

(2013-09-23, 13:13:14)belotte Wrote: datiswous: As interesting as this would be, again I just want a simple list; no tabs.

The simple-input-tabs plugin is not about adding tabs to the page. it's for making multiple parts of your page editable via the wysiwyg-editor. So if you would make a page with multiple bios, every bios can be edited in a tab in the page-edit screen.

What you can also do:

Quote:http://get-simple.info/wiki/themes:template_tags

getPageContent(), returnPageContent()
<?php getPageContent('slug'); ?>
<?php returnPageContent('slug'); ?>
Echos or returns slug's content (slug's URI/name as option). Use this function if you want to display certain slug's content on all pages. This function comes in handy for those, who want to have custom content boxes in template, and display them on f.e. homepage.

So you make multiple pages (but don't make them part of the menu) and then in the template you rever to them. If the site is more than one page and you don't want them on all pages, you use a template. You can simply edit those pages to change the different bios'sen

I actualy never really used these methods, but it should work.

hameau · 2013-09-23, 23:14:19

(2013-09-23, 13:13:14)belotte Wrote: hameau: I am not using a search. I just want a page with listings.

Yes, I understand. However, the I18N Search plugin is not only for a search box on your site. As well as the Catalogue page, I use I18N Search to show a Site Map page, for example.

belotte · (This post was last modified: 2013-09-24, 18:36:11 by belotte.)

Hello datiswous and hameau.

So datiswous. I understand now how "simple-input-tabs" works now, and it's is indeed very useful. I still don't believe it works for what I want to do though. As there will be many bios and more being added all the time. Even if I did a different tab for each bio He would still need to get into the html to structure the page so they would all show vertically. And then there's the problem of the image on the right side. He would have to be able to again, edit the html and css to get the image placed properly next to the text (unless there is a way of putting one tab into another). Breaking it up into multiple "component" and pulling them all together in the templet has the same problems.

hameau: I don't understand what you mean. is there an example page to look at (and perhaps a code example)?

This is a very simple version of what I am shooting for:

Thanks for all the help every one!

**Timbow** · (This post was last modified: 2013-09-24, 18:54:50 by Timbow.)

Don't go away belotte, when I have finished chasing down some other things I have to make my easy-edit events listing page so I will let you know how I get on.

Should be this week.

belotte · 2013-09-24, 19:08:12

That would be awesome!
Thank you so much!

Big Grin

(2013-09-24, 18:54:08)Timbow Wrote: Don't go away belotte, when I have finished chasing down some other things I have to make my easy-edit events listing page so I will let you know how I get on.

Should be this week.

hameau · 2013-09-25, 00:31:49

(2013-09-24, 18:34:46)belotte Wrote: hameau: I don't understand what you mean. is there an example page to look at (and perhaps a code example)?

Have a look at the Catalogue page that I linked to in my earlier post. Is that not similar to what you want? (I only show the first paragraph until you click 'full details »', but you can change that to show the whole text.)

With I18N Search, I set the tag for each page of the catalogue to _catentry and then include this code in the Catalogue page:

Code:
(% searchresults order=url tags=_catentry max=6 showPaging=1 HEADER="" %)

So, that Catalogue page is built automatically from all the pages with the tag _catentry. How simple is that?

I am sure that there are many other ways to achieve the result that you want, but this works for me.

datiswous · (This post was last modified: 2013-09-25, 05:00:45 by datiswous.)

mrdragonraaar did some updates on his Link manager 2 plugin. Now it's possible to make pages like this (ignore the picture-menu on the right).

I assume you can style it so that the image will be on the right, text on the left with H3 title or something.

Although I think hameau's option is probably best.

**Timbow** · 2013-10-03, 21:25:53

My events listing page was never done. We decided just an ordinary page would do the trick so sorry I haven't got anything for you.

belotte · 2013-10-04, 15:17:36

Hello Timbow.

That's ok. Thanks any way. I haven't gotten to it yet but I am going to try the last two sugestions (thanks to both hameau and datiswous).

I will post what works best.

belotte · 2013-10-04, 16:10:07

Hello datiswous.

Thanks for the suggestion of using Link manager 2 to create the bio page I nrrd. The example you point to is great.

I however have no idea how it was created. I went through the support pages for the plug in... but I didn't see any thing that would lead me to figure out how that particular layout was created with that plug in.

Thanks to every one for all the help by the way. Awesome to get this kind of support!!!

datiswous · (This post was last modified: 2013-10-05, 07:41:44 by datiswous.)

(2013-10-04, 16:10:07)belotte Wrote: Hello datiswous.

Thanks for the suggestion of using Link manager 2 to create the bio page I nrrd. The example you point to is great.

I however have no idea how it was created. I went through the support pages for the plug in... but I didn't see any thing that would lead me to figure out how that particular layout was created with that plug in.

Thanks to every one for all the help by the way. Awesome to get this kind of support!!!

Hello, information is in the forum topic, post 25.

You have to make a new category.
Link display options: Icon and text (maybe only icon is also possible).
check the box: Show description

Then for every part you make a new link, but set no url or internal page.
Set the category. and the thumb-url.

For your project hameau's idea is probably simpler, on the other hand, if you really want this format it can still be useful.
Further questions about that plugin you should ask in the plugin's forum topic

I have put the following css in my theme:

Code:
/* plugin style */

.linkmanager2 li {

    margin: 30px;

    list-style-type: none;

}

.linkmanager2 img {

    border: 1px none;

    border-radius: 7px;

    vertical-align: middle;

    margin-right: 20px;

}

span.lm-link-desc {

    display: block;

    padding-left: 200px;

}

I might not make the best styling, I'm still figuring out how to do it correct, if you come up with something better, do post it here.
I made the following component called "bios":

Code:
<div class="linkmanager2">

  <?php get_links(3); ?>

</div>

The number 3 represents the category id.
then I've set the following code in the specific page:
{% bios %}
You need the Dynpages plugin for that. You can also simply use a separate template file, probably easier.

On a side thought, I wonder if I can use a component to store css (although would that make sence?).

belotte · 2013-10-06, 20:00:27

datiswous, thank you so very much.

Every one's help has been amazing. I will look at this tomorrow a bit more in depth.

hameau, your example came in very handy. I'm starting to understand what you meant. I was able to get it working for the most part. The question I have now is how are you handling the images? I put in a field for image upload in my special page. I went looking at the support pages for the plug in and tried various versions of what I could find, but I cant get the image to sow in the results.

Also how are you adding classes and id to style the elements? They seem to be striped out when the results are generated.

hameau · 2013-10-07, 02:16:27

(2013-10-06, 20:00:27)belotte Wrote: The question I have now is how are you handling the images? I put in a field for image upload in my special page. I went looking at the support pages for the plug in and tried various versions of what I could find, but I cant get the image to sow in the results.

You must set custom code in the configuration for your Special Page, in the 'Search' section (Plugins->Configure I18N Special Pages->select special page type->Search).

In my case I have this code in HTML/PHP code for the display of a search result:

Code:
<div class="catsearch">

<img class="alignright" src="<?php get_special_field('cat-picture'); ?>" width="100" />

<h2>

  <a href="<?php get_special_field('simplelink','',false); ?>">

    <?php get_special_field('title','',false); ?>

  </a>

</h2>

<?php get_special_field_excerpt('content', '1p'); ?>

<a href="<?php get_special_field('simplelink','',false); ?>">full&nbsp;details&nbsp;»</a>

<div class="cleardiv">&nbsp;</div>

</div>

You can see how the image is shown ('cat-picture' is the name of the image field in the Special Page, of course).

I apply custom search result styles using div.catsearch ... in the css selectors.

Login
Username:
Password:	Lost Password?
	Remember me