Comment Modules

afoster · 2020-07-28 16:06:20

I am getting responses on this thread that have nothing to do with my problem…can someone fix this?

Bloke · 2020-07-28 16:22:50

afoster wrote #324944:

can someone fix this?

Fix what? Do you mean:

Perhaps you can also tell me how to add a menu item next to Home/Articles in the navigation banner?

Which jakob answered.

If you mean:

How can I place a corder around the comment module that is displayed so that it sticks out more?

Then yes, as bici said, Style rules can be altered from the Presentation>Styles panel. As soon as you make changes and refresh (assuming your server isn’t caching anything – in which case, you may have to hard refresh – Shift-F5/CMD-SHIFT-R) then the changes will be reflected immediately on your site.

If you mean:

I can’t seem to grasp how this CMS works

Then I’ve tried to give you a birds’ eye view in my responses to get you oriented: a high level overview of what each component is so you can start to grasp how they fit together.

If you mean:

Could one of you refer to the tutorial and show/tell me where I went wrong?

Then I would probably not try and follow the tutorial to the letter because things have changed drastically since it was published. You’ll tie yourself in knots trying to use the zip file provided there because tags have changed and things have moved on.

The best tutorial is to install Textpattern 4.8 and step through the code in the default template (which governs what appears on the home page). Then do the same with the archive template (which governs what appears everywhere else).

By reading the comments  in there and following through the page, matching up what you see on the front-end website with what’s in the template, you can begin to see how each piece in the page template represents something on the site.

Then it’s a case of experimenting. Add some text and see where it pops up. Change an attribute on a tag using the tag reference as a guide, and see how the output differs. Add a Section and see that it pops up in your navigation bar on the front end. Then maybe find the <txp:section_list /> tag and play with that. Add an article to the ‘Articles’ section and see that it appears on the home page and in the /articles section. And so forth.

If you install the vanilla 4.8 so we know where you are, and you get a bit lost, please ask a question or two about specific parts of the process that are confounding you and we’ll try and help out with those portions to get you on your feet.

Last edited by Bloke (2020-07-28 16:26:19)

afoster · 2020-07-28 17:04:44

My reference to “fix this” was in relation to the posts about the location of the themes page. I have been reading everyone’s response to my question and am trying to work through them.

jakob · 2020-07-28 17:12:46

afoster wrote #324944:

I am getting responses on this thread that have nothing to do with my problem…can someone fix this?

Hi, as Bloke and bici have mentioned, the tutorial is from 2009 so Textpattern (and the web) have developed quite a bit since then. I downloaded the files from that page (which unfortunately don’t quite match the description in the text) and updated them for Textpattern version 4.8 for you:

You can download that as a theme called PoulinPortfolio here.

To install that:

Download the zip and unzip it on your computer
Copy the folder called “PoulinPortfolio” (pls don’t rename it for now) to the /themes directory in your Textpattern installation.
Now in your Textpattern admin area, visit Presentation › Themes. At the top you should now see “Import from Disk: PoulinPortfolio”. Click Import.
You’ll now have an entry under Themes for PoulinPortfolio.
To apply the theme to your site – or to individual sections of your site – visit Presentation › Sections and either visit each section you have created one by one and assign the theme “PoulinPortfolio” and the respective “Page template” (as per the tutorial) and the Style to “screen”. You can also do that for several at once by using the tick marks in the list and then the dropdown at the bottom to apply themes, sections and styles to multiple sections in one go.

Differences to the tutorial:

By importing the theme I’ve supplied, you don’t need to copy and paste any of the templates or forms. You also don’t need to assign them to the respective form types (that’s already done). Textpattern’s theming system (which wasn’t available at the time of the tutorial, keeps themes separate, so you don’t need to overwrite any of your own templates).
You don’t need to install any of the plugins mentioned (I changed the templates to use built-in textpattern tags), except … (rvm_if_this_article -> txp:if_article_id, and upm_article_image -> txp:images / txp:image, ebl_img_edit used flash and is no longer available).
If you wish to create a contact form, like in the tutorial, you should use “com_connect” which you can download here. It works in exactly the same way but uses the tag com_connect instead of zem_contact (see notes here).
Some of the forms mentioned in the tutorial weren’t actually in the download. I’ve done a best-guess at what they could have contained.

General notes:

To see something with the template, you do, of course, have to create some articles and images (at the specified sizes) and assign them to the respective articles. The tutorial describes that, also that you need to make a sticky article for the intro text (I put that in the about section). I tried it out quickly and it does still work.

The templates Marie Poulin are quite bare bones and are designed to illustrate the principles. I’ve tried to change as little as possible. It does mean some things are hard-coded (like copyright message, menu sections etc.) and it’s not responsive. That means you must supply images in the correct sizes or the layout will break. Nowadays you’d do that differently using css flexbox or css grid. If you want to use my test images (simple flat-colour and labelled images), you can download them here.

Screenshots: Homepage, About, Work, Work item.

afoster · 2020-07-28 17:51:42

Jakob, thank you so much for your response and after reading through it I believe I will be better off starting from scratch and importing the theme you attached to your response. Otherwise I would have to back and undo all the changes I did by using the tutorial from 2009. I will check back if/when I need additional help.

First question…in looking at the screenshots you provided, how/where would I place the image at the top of the homepage. I have an image that fits the size needed but have not been able to get it to display. For that matter, I have not been able to display the homepage.

Second question…I have been able to remove the webpage information from the contact form. I would like the Name and Email labels and text boxes to appear in two columns…can you point me in the right direction for that?

Last edited by afoster (2020-07-28 22:10:12)

colak · 2020-07-29 16:39:48

afoster wrote #324954:

First question…in looking at the screenshots you provided, how/where would I place the image at the top of the homepage. I have an image that fits the size needed but have not been able to get it to display. For that matter, I have not been able to display the homepage.

Can you post some of the page code you are trying?

Second question…I have been able to remove the webpage information from the contact form. I would like the Name and Email labels and text boxes to appear in two columns…can you point me in the right direction for that?

You can place each of those fields in a divs and give those divs a max-50% width and appropriate styling (ie width:49%; margin-right: 1%; float:left;), although Jakob and other people here may suggest a more modern way of doing it:)

jakob · 2020-07-29 19:26:21

afoster wrote #324954:

First question… Second question…

Sorry, I didn’t notice your edits. If you post a fresh forum comment, the thread shows up as being updated.

in looking at the screenshots you provided, how/where would I place the image at the top of the homepage. I have an image that fits the size needed but have not been able to get it to display. For that matter, I have not been able to display the homepage.

I followed the tutorial :-) The homepage template is described under “Set up your page templates”. You just need to assign the correct page template:

Visit Admin › Presentation › Sections
Click on default and set the page template to Home.
Click Save.

And under “Bring it all home” in the tutorial it says: “You will notice in the “home” page template, that there is this tag: <txp:image id=”3″ />. Replace this number with the # of the image you want to appear here …”

Visit Content › Images and note the id number of the image you want to use.
Visit Admin › Presentation › Pages.
Click on home.
Find <txp:image id="3" /> and replace 3 with the image number you noted. It has to be 940px wide by 350px high.

That’s not really an ideal way of doing it, but I didn’t change the template more than necessary so that it still roughly corresponds to the tutorial. It’s really written to help you get the idea of how things hang together.

Second question…I have been able to remove the webpage information from the contact form. I would like the Name and Email labels and text boxes to appear in two columns…can you point me in the right direction for that?

I’m guessing you mean you created an article and assigned to the “contact” section, then added com_connect tags to the body area to produce the contact form.

If you’ve done that, then, like Colak mentioned, you just need to add some html and the appropriate styling to your contact form. Marie writes in the tutorial, she’s using an adapted version of Google Blueprint CSS (rather outdated after 11 years, but I digress) and that has some column styles already in it based on a 24-column grid. I’m not familiar with it, but something like this should work:

<txp:com_connect to="recipient@example.com" label="" wraptag="div" class="container">
    <div class="span-12">
        <txp:com_connect_text label="Name" break="" />
    </div>
    <div class="span-12 last">
        <txp:com_connect_email label="Email" break="" />
    </div>
    <txp:com_connect_textarea label="Message" rows="10" cols="23" break="" />
    <txp:com_connect_submit label="Send" />
</txp:com_connect>

I’m not on the computer I tested it with at the moment, so I can’t test it. You may need to adjust it accordingly.

A general note:

What I tried to point out earlier, and what bici mentioned, is that the tutorial is good for showing the principle of how pages are put together with Textpattern (I didn’t need to change much at all for it to work after all these years) but it does some things with hard-coding, i.e. the image number or the menu section names. That’s expedient for showing the principle, but not extensible.

CSS has also come a long way since then. You can use CSS grid or flexbox to build page layouts that are much more robust and adapt to changing device widths and you can contain images in boxes so that layouts don’t break if images aren’t precisely sized.

I suggest using the tutorial as inspiration and for understanding how the parts of Textpattern fit together but it’s not such a great basis for a final site.

afoster · 2020-07-29 20:17:52

Thank you both for your responses to my latest plea for help. In re-reading my message, I noticed that under my “Second Question” I reference the contact form when I really meant to reference the comments form. I have not done anything to the contact form yet, but your post Jakob about that topic should help me. I will try to apply the <DIV></DIV> to the comment form and see if I can move the Name and text area to a second column.

UPDATE: I just realized that even though I have set up to allow comments, there is no way to add a comment on any article, blog entry or work entry. Where did I go wrong this time?

Last edited by afoster (2020-07-29 23:15:56)

jakob · 2020-07-30 08:09:39

UPDATE: I just realized that even though I have set up to allow comments, there is no way to add a comment on any article, blog entry or work entry. Where did I go wrong this time?

It’s nothing you did :-) The short answer is that Marie’s original template doesn’t include code for comments.

A longer answer in the spirit of helping you find out why: apologies if this is not the most direct path to an answer, but I’ll try and follow through the process of diagnosis as it may help with getting bearings. Let’s look at just the blog articles for the moment:

In Admin › Presentation › Sections look at the “blog” section. It should be assigned to the archive page (if you followed Marie’s instructions). If not assign that as the page.
So, let’s look at what that shows: In Admin › Presentation › Pages, look at the “archive” page template. If we look in there, we see:

<div class="span-8">
    <txp:article_custom section="blog" form="subnav" sort="posted desc" />
</div>

<div class="span-16 last">
     <txp:article form="single" listform="article_listing" sort="posted desc" limit="1" />
     ...
</div>

The first column (span-8) is an article_custom tag that specifically gets articles from the “blog” section and outputs them using the subnav form. The article_custom does is a specific request that is not context-aware (i.e. pays no regard to what page you might be on).

The second column (span-16) is an article tag that is context aware: on an article_list page it uses the form specified in listform (e.g. article_listing) and on an individual article view, it uses the single form. That’s the case we want.

So, in Admin › Presentation › Forms, open the “Article” group on the left-hand side and look at the “single” form template:

<h3><txp:title /></h3>
<txp:body />

That’s very bare bones: just the title and the article body. There’s no mention of comments anywhere there. That’s the reason why none show:💡!

What now? Compare that against the default theme. In the default “four-point-eight” theme, an article is output using the default form of type: article (if you don’t specify a form name the txp:article tag uses “default” as standard). There you’ll see this code (here on GitHub for reference)

<!-- if this is an individual article then add the comments section via form: comments_display.article.txp -->
<txp:if_individual_article>
     <txp:output_form form="comments_display" />
</txp:if_individual_article>

That should be self-explanatory. You’ll find the comments_display under the “comment” group of the forms panel (here on GitHub). That form calls a few other forms in the comment group.

Unfortunately, Marie’s template includes none of that and I didn’t repair the missing holes.

Solution: What you can do here is copy over the form code from the “Four-point-eight” template. You’ll need “comments_display”, “comments” and “comment_form” and you can find them if you switch theme at the top of the “Forms” pane (or here on GitHub if you’ve overwritten yours). Those forms are more involved and more capable than Marie’s original simple template but they also have comments in them to help you understand what’s happening where.

I hope that helps and doesn’t confuse 😳

etc · 2020-07-30 12:30:30

This makes me think (again) that txp really needs to be furnished with a very basic ‘first steps’ theme. Unfortunately, I have no designer talents..

jakob · 2020-07-30 12:35:25

etc wrote #324999:

This makes me think (again) that txp really needs to be furnished with a very basic ‘first steps’ theme. Unfortunately, I have no designer talents..

It’s already in the works – also with a portfolio as a focus – but I’m just a little overwhelmed with work at the moment.

etc · 2020-07-30 12:39:30

jakob wrote #325001:

It’s already in the works – also with a portfolio as a focus – but I’m just a little overwhelmed with work at the moment.

Oh, great, thank you! If you can keep it basic (just essential forms/pages/tags) I’m sure it will help with first txp steps.

Textpattern CMS

Textpattern CMS support forum

#25 2020-07-28 16:06:20

Re: Comment Modules

#26 2020-07-28 16:22:50

Re: Comment Modules

afoster wrote #324944:

#27 2020-07-28 17:04:44

Re: Comment Modules

#28 2020-07-28 17:12:46

Re: Comment Modules

afoster wrote #324944:

#29 2020-07-28 17:51:42

Re: Comment Modules

#30 2020-07-29 16:39:48

Re: Comment Modules

afoster wrote #324954:

#31 2020-07-29 19:26:21

Re: Comment Modules

afoster wrote #324954:

#32 2020-07-29 20:17:52

Re: Comment Modules

#33 2020-07-30 08:09:39

Re: Comment Modules

#34 2020-07-30 12:30:30

Re: Comment Modules

#35 2020-07-30 12:35:25

Re: Comment Modules

etc wrote #324999:

#36 2020-07-30 12:39:30

Re: Comment Modules

jakob wrote #325001:

Board footer