Forum

Thread tagged as: Question, Problem, Field-Types

Centering Text - Using Template 

<perch:content id="text" type="textarea" label="Text" markdown="true" editor="markitup" html="true" align="center" imagewidth="640" imageheight="480" />

This is my perch text template. I can't figure out how to center with the markdown. So I've tried adding into my template. This however is not working.

I'm also having a similar issue with my template for my images. I can't get the CSS to float the images and add a margin: posted below

<li style="list-style-type:none" style="float:left" style="margin-right:20px">
  <a href="<perch:content id="image" type="image" label="Image" width="800" height="600" />">
    <img src="<perch:content id="image" type="image" label="Image" width="75" height="75" crop="true" />" 
         alt="<perch:content id="title" label="title" type="text" required="true" />" />
  </a>
</li>

I'd also like the thumbnail to be 100x100 but anytime I change those. reload .. the images appear to load full size. Maybe my code is wrong or I don't fully understand how to use the fieldtypes? Please help.
Tammy Parkhurst

Tammy Parkhurst 0 points

  • 5 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

5 years ago

You should be putting those styles in your CSS file. If they really must be inline, you can declare each attribute only once. So instead of this:

<li style="list-style-type:none" style="float:left" style="margin-right:20px">

do this:

<li style="list-style-type:none; float:left; margin-right:20px">
Tammy Parkhurst

Tammy Parkhurst 0 points

5 years ago

Ok I can do that. I understood I could use them there but I'll put them in the CSS file.

What do I do about the text issue? Is there away to markdown the text to have it center?
Creative Monster

Creative Monster 0 points

5 years ago

Tammy you should add that to your CSS too. Or if you want to give the user the option, you could use Perch Blocks to offer the choice of 'Centered Text' or 'Left Aligned' text for example.
Tammy Parkhurst

Tammy Parkhurst 0 points

5 years ago

Awesome! The corrected code above worked! Thank you! I was overthinking it for sure. I really appreciate it! Toby I will give that a try. Thank you :)
Tammy Parkhurst

Tammy Parkhurst 0 points

5 years ago

I'm still having an issue with the width and height. For some reason when it is at 75 it works flawlessly but when it is set as these. it shows as full images not thumbnails. Am I overthinking this??

<li style="list-style-type:none; float:left; margin-right:20px">
  <a href="<perch:content id="image" type="image" label="Image" width="800" height="600" />">
    <img src="<perch:content id="image" type="image" label="Image" width="226" height="150" crop="true" />" 
         alt="<perch:content id="title" label="title" type="text" required="true" />" />
  </a>
</li>
Toby Martin

Toby Martin 1 points

5 years ago

When you change the dimensions of your image in a template, I believe you need to re-upload the images to generate the new sizes.
Tammy Parkhurst

Tammy Parkhurst 0 points

5 years ago

Touche' ... Thank you!