How to move image below Blog title / heading on Native template?

22 hours ago, samizdat said:

if being in the trial and nonpaying means that you can't see the site, i'll go ahead and pay now, i guess.

Your site can be in trial mode and we can still see it, if you set it up for us.

No need to pay for the site yet.

53 minutes ago, creedon said:

Your site can be in trial mode and we can still see it, if you set it up for us.

No need to pay for the site yet.

@creedon

i think i’ve set it up properly for others to view. please let me know if i haven’t done it correctly.

i have a couple of posts on my blog (called “notebook”), and you’ll see the date of the post detached from the post titled "christopher shy." hoping to get that moved up to the title by day’s end. thanks, again.

On 1/5/2022 at 3:01 PM, samizdat said:

I see that datclaiborne never followed up with you about moving the date under the title and above the image (at least, not publicly). could you assist with me getting the date moved?

On the v7.0 Wells template it is not possible to move just the date with CSS alone. It might be possible with CSS and Javascript but that would require the business plan or above.

If you are OK with moving the date and the category the post is in then please see Blog Header After Title.

Let us know how it goes.

worked like a charm. thanks, @creedon!

Hi, @creedon more about moving blog titles above or below the image.
I'm in 7.1 and on the post page (not the grid) I need the title to be below the image. Was thinking a workaround might be to put the title in the body of the post, then hide the original title (the one on top) just on the post page. Thoughts? Code to do that? Thanks in advance!

48 minutes ago, lbird said:

I'm in 7.1 and on the post page (not the grid) I need the title to be below the image.

Please post the URL for a page on your site where we can see your issue.

If your site is not public please set up a site-wide password, if you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site. Please read the documentation at the link provided to understand how it works.

Please read the documentation at the link provided on how to share a link to your site to understand how it works. A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

We can then take a look at your issue.

Hi, thanks - 

https://grouper-glockenspiel-5ms6.squarespace.com/

And it's public. The area in question is under "Our Posts"

23 hours ago, lbird said:

I'm in 7.1 and on the post page (not the grid) I need the title to be below the image.

The way the page is structured it is not possible to move the title after the image with CSS alone. It might be possible with Javascript/CSS and requires the business plan or above. I am unaware of any code that currently does this.

Thanks - just to be thorough, could the page be structured differently to allow for CSS to do this? 
ie maybe I could put the title in the body of the post and hide the title just on the post page? I'm reaching here, I know.
And we have the basic commerce plan that will accommodate javascript.

3 hours ago, lbird said:

just to be thorough, could the page be structured differently to allow for CSS to do this?

Possibly but it would take JavaScript and to restructure the page in this manner to accommodate using CSS to move the title would be major. It would be much less painful/expensive to use JavaScript to move the title element to a new location.

Quote

maybe I could put the title in the body of the post and hide the title just on the post page?

That is certainly a valid CSS only approach to the issue. Well other than having to enter the title twice.

On 8/31/2022 at 7:10 PM, lbird said:

I'm in 7.1 and on the post page (not the grid) I need the title to be below the image. Was thinking a workaround might be to put the title in the body of the post, then hide the original title (the one on top) just on the post page. Thoughts? Code to do that?

As the image is part of the post content, there isn't a way to 'safely' move the title below it (avoiding potential layout issues). That said, your workaround of adding the H1 heading manually to the top of the article would allow you to get around this.

You should be able to hide the original title with the following CSS (in Design > Custom CSS). This will leave the date above the blog post content:

.blog-item-wrapper .blog-item-title {
  display: none;   
}

Alternatively, you can hide the entire 'blog top wrapper' (which includes the title and the metadata):

.blog-item-wrapper .blog-item-top-wrapper {
  display: none;   
}

I hope this helps 🙂

We like to know if our posts help. Please consider clicking a 'Like' or 'Thanks' icon below  ⬇️

Thanks, it does. But I realized that I'd be hiding every title of every post going back 6 years and I'd have to go in and redo them all manually to put in the title within the text box. But thanks for confirming that it *might* have worked!

1 hour ago, lbird said:

I realized that I'd be hiding every title of every post going back 6 years and I'd have to go in and redo them all manually

If it helps, from a user experience point of view, I prefer the version that you have now with the title at the very top 🙂

thanks. if only the client agreed  ; )