Viewing Help! I'm struggling

Help! I'm struggling



User: Brian H. one month ago
After a pause of more than 10 years I want to update my personal website. My old copy of Dreamweaver won't work on my current MacBook Pro and I can't afford to pay an Adobe subscription for what I gather is now an outdated piece of software.

I had also used iWeb for some pages on the site and the standalone version of Everweb looked like the best and most affordable option. I'm trying out the free version but getting nowhere fast. I've read through the relevant sections of the PDF manual and watched the associated videos but I can't find a way of placing a picture where I want it with a headline which runs alongside on a desktop browser but displays underneath on a phone. I've attached a small image of a Wordpress theme's layout that I want to copy then add to.

Once I put an image on the page on a blank responsive layout I have difficulty manipulating it. I've tried full width with a right margin, not full width and set left, but the size and position options are not intuitive to me. Why when I reduce the size of image to the scale I want does the box remain the original size? Why when I grab a corner to resize does the picture crop and scale at the same time?

I thought a flex box might be the answer, and maybe it is, but I cannot get it display more than a narrow horizontal slice of the image and I don't see an option to increase the depth of a flex box in any of the tabs in the inspector.

Can anyone lend a hand to a novice?

Screenshot 2024-03-23 at 18.24.23.png
User: EverWeb Support one month ago
Hi Brian,

Thank you for reaching out to us.

You can achieve the desired result by using a responsive row and placing both elements (image and text) inside it. The responsive row ensures that your page elements adapt and wrap appropriately when viewed on mobile devices. For detailed information about using the responsive row, please refer to the following tutorial: Responsive Row Widget

Let us know if you require further help.

-------------------------------
EverWeb Customer Support
Submit Tickets or Learn More
User: Brian H. one month ago
Thanks very much for the reply. I've made some progress but have now run into a problem with the text box in the responsive row. The only way I can get the text to line up with the bottom of the picture in desktop view as I wish is to drag the bottom of the text box downwards to match the height of the image.

This doesn't work in mobile view because when the text wraps underneath, all that empty space at the top of the text box intervenes. When I reduce the height of the box to match the text it sticks to the top of the responsive row (see attached screen grab) and I can't find a way in any of the inspector tabs of moving it to the bottom.

Changing the Y value in the position field with the text box selected has no effect. When selecting the whole row I can see no alignment options that help. Is there a way round this?

Thanks again.

Note: the screen grab I tried to attach isn't showing and there's no attachment option when I edit the post. Here’s a link to it:
https://i.ibb.co/MRwk0tm/Screenshot-2024-03-24-at-19-38-03.jpg

Last edit one month ago
User: Brian H. one month ago
Worked that one out in the end. It appears that you can define alignment options for a responsive row before adding any content but not afterwards. Setting the vertical alignment to bottom before adding the picture and text box had the desired effect.

This, of course, led me to another set of difficulties:

1. I want the bottom of the text without descenders to line up with the bottom of the image alongside it. Can't see how to do that except perhaps to add the necessary amount of white space to the bottom of the image by trial and error.

2. When viewing on mobile the headline text stays in two lines instead of opening out into one, as desired. I could imagine solving this by expanding the text box to to the left over the picture and using text wrap to push it into two lines alongside on a desktop but there's no text wrap option on the image. And when I widen the text box it just wraps underneath the picture.
User: Brian H. one month ago
Oh well. I see that this is not the most active of forums. But no reply to the follow-ups.

I can't see me continuing with software that I need hand-holding at every stage TBH. I am normally very good at picking up how things work. I'm pretty good at Photoshop, Premiere Pro and Apple Logic for example.

But I find Everweb baffling at every turn. It's not at all intuitive when you step outside the templates. So I probably won't be buying it.
User: Jesse M. one month ago
Sorry you are having so much trouble. The responsive row and flex box are capable of quite a bit, but it can be tricky to make it do what you want without some knowledge. There are also tutorial videos to help with design layouts.

If you can't get the responsive row to do what you need, I would recommend checking out everwebwidgets.com. There are hundreds of widgets made for Everweb that perform all kinds of functions and layouts. The newest are also all responsive and will work on most any device (with some tweaking). I'd check out the "Themes" and Responsive widget categories. Best of luck!
User: Paul-RAGESW 29 days ago
Hi Brian,

Sorry for the issues you are having.

Quote:
Worked that one out in the end. It appears that you can define alignment options for a responsive row before adding any content but not afterwards. Setting the vertical alignment to bottom before adding the picture and text box had the desired effect.


You can adjust all the settings for the Responsive Row no matter if it has content or not. This should work either way. If you are having issues with this, you can contact support and we can clear up the issues for you.

Quote:
1. I want the bottom of the text without descenders to line up with the bottom of the image alongside it. Can't see how to do that except perhaps to add the necessary amount of white space to the bottom of the image by trial and error.


Please remember, responsive rows change with the size of the browser. Getting elements to align perfectly is not going to work because of this. It is not like photoshop or a static graphic design app. You are designing a web page that will have dynamic content. Also, fonts can slightly change between browsers and devices, especially if you are using non standard web fonts.

Quote:
2. When viewing on mobile the headline text stays in two lines instead of opening out into one, as desired. I could imagine solving this by expanding the text box to to the left over the picture and using text wrap to push it into two lines alongside on a desktop but there's no text wrap option on the image. And when I widen the text box it just wraps underneath the picture


You can use the minimum font size feature that will shrink the text based on the screen size from the Inspector->Text Settings tab. This is explained in more detail in this video here Creating Scalable Text with EverWeb's Minimum Font Size Feature

-------------------------------
Paul
EverWeb Developer


Post Reply
You must login or signup to post.