Use of returns to create height in content component

Fine, my friend, but if this causes Aesop content components to suddenly go from nice-n-high to letterbox height… that’s an issue you may want to know what to do about?

I’m goign to go enter those line breaks everywhere.
thanks,

Boris.

We have absolutely zero control over how the user formats their post inside of WordPress.

Last question though.

You can confirm that if I want to have a content component that is X lines high, I do have to enter X number of line breaks and then close with [/aesop content] tag?

That is the way to do this, right? Or is there a smoother way to set the height of the content component?

You want to avoid setting a height on it at all. When you make the screen smaller the height will stay and your text will just fall out of the container. You might try adding some custom css to increase the padding on top and bottom, if you want additional space.

Use a plugin like Simple Custom CSS to store your css edits,or use a chidl theme.

do you use skype?
I feel like I’m really wasting your time with my noob questions, but the issue I have DOES have to do with me learning the Aesop ropes.

can we skype just a short bit? I really would like to explain this to you.

@borisdejong: Please do not solicit contact via Skype. Asking others to contact you off forums is really frowned upon here. The point of these community-based forums is to help each other in a public space so that the whole community can benefit from the discussion and any solutions proposed. Private discussions take this benefit away. If you would prefer a one-to-one discussion, please try https://directory.codepoet.com/ or https://jobs.wordpress.net/

OK,

I’m now going into the text editor and entering </br> instead of nbsp; …. in hope that WordPress won’t nix those too.

the effect seems to hold up under screen resizing.

you see my point is not about padding… it’s about adding text at the BOTTOM of a picture.

Man I wish I could show this to you as I explain. I feel like this is something people will use in Aesop all the time… it;s such a common formatting choice for stories.

OK, esmi, point well taken.
I’m just really frustrated with having to explain everything in type…

Nick, hope I didn’t piss you off there by asking your skype. just trying to get that plane you built to really fly for me.

you’ve been really helpful so far.

LOL no worries. We’re working on putting together more resources to help you on your way.

OK thank god for that, I really appreciate your help.

Also, I found out more about the nixed line breaks.
This is apparently a given with WordPress: it often auto-deletes multiple line breaks.
Because I used this all over the place to create height in your content component, I need to find another way of doing this.

What I’m after is just putting up a picture and having a paragraph of text at its bottom, to guide the reader out of the image and back into the narrative.
I’ll bang my head some more and put up the results here.

It must be possible, and without resorting to Custom CSS… I still know next to nothing about that.

As far as I know, WordPress automatically removes   and < br />. You may want to try adding <p></p> (this is all in the HTML editor) but it is likely those will be removed as well when you switch to the Visual editor.

Thanks, simple_mama.
I… I thought I now had a workaround using

line break & space
line break & space
line break & space
etc.

The effect seems to be that tinyMCE doesn’t count it as an empty line, and so leaves it be.

Still, it’s a crude solution.
See the result at https://www.storyfall.nl/feasible-dream

I have pictures with text in them using Aesop’s content component, but that component by default makes the height of the bg image no higher than the content text. I want the bg image to reach much higher than the content text, so as to create ‘an image with text at the bottom’.

My ‘line break & space’ workaround will have to do. IF tinyMCE leaves it be…

I can see all the <p></p> you’re using in the code. ?? If it works, then great! An alternative may be to add some custom CSS to the blockquote element. This would, however, apply to any blockquote on the site (unless you know CSS well enough to get specific to the ID/class). By adding some padding to the top of the blockquote, you could essentially do the same thing that your <p></p> are accomplishing.

Hey thanks for sticking around to help me simple_m. I’m in Europe so, it was bedtime 7hrs ago.

Anyway I think what you proposed is what Nick Haskins has been trying to tell me all along. He just kindly said ‘use custom CSS’ but i had no idea where to start on that.

You’ve just given me an idea where to start (‘increase the top padding’) and thank you for that, but I do think I’ll need more than just CSS for the blockquote.

Look if you will at the paragraph under ‘Believers in biomass’ for example. It’s not just a blockquote: it’s a header and then a paragraph in white type over the image, and then having the black type continue under the image. I love that, it creates a playful and enticing flow in the narrative.

So ideally I want to be able to add that ‘increased top padding’ attribute to just about anything: blockquotes, Header 1s, header 2s, anything. That would be GRAND.

I’ll get started on the custom CSS to see how far I can get for blockquotes and maybe a child version of the Header 1, but I really also think this ‘increased top padding’ something Nick may want to consider adding to his Content component as such as well. It’s going to be a staple food for this kind of layouting, I’m sure.

If altering the CSS of just the blockquote isn’t enough, then maybe you can create a couple custom classes and wrap your text in them. You could make a custom class for the top padding and another for the bottom bottom (and one with both if you need it), then just wrap your text in the class. Just another thought. ??

You are welcome to leave your feedback for product suggestions at https://aesopstoryengine.com/feedback/