Blog Format Issue - Move Multiple Tables/Layers Easily?

Familiar with web-design ? Trouble with images, tables ? Any other queries ?

Moderators: BobCP, agsone, Neil Parks, gregtutor, Lem3

Blog Format Issue - Move Multiple Tables/Layers Easily?

Postby psychtrailmix on Thu May 18, 2017 2:42 pm

I feel kind of stupid after doing all this... Anyway, I wanted to create a blog and use Kompozer rather than blogger or something, as with Kompozer, I can have full control, rather than a set template. I know that blogs are generally set up as newest posts first and then in descending order with the oldest at the bottom. Well, all was going well - I was using "layers" and "tables" on everything so that I can place images and tables (containing the text) exactly where I want them to appear. Well, now I see that when it comes time to post my newest post at the top of the blog, none of these tables/layers will easily move lower so that I can squeeze in the newest posts at the top. Is there any way to easily move the 3 blog posts I've already created lower so that I can place the new blog post at the top of the page?

If not, then I guess I would be ok with working from top to bottom with older posts first and newest posts at the bottom... I could even include an anchored link at the top with something like "jump to newest post" or something so that people can easily hop to the bottom of the page. Any help would be appreciated. I'd like to try and launch my blog on Friday, I will gladly do the workaround like I mentioned, but if anyone knows how to easily move everything lower so I can do newest blog posts on the top of the page, that'd be great.
psychtrailmix
 
Posts: 35
Joined: Tue Jul 07, 2009 10:52 pm
Country: United States (us)

Re: Blog Format Issue - Move Multiple Tables/Layers Easily?

Postby dr-john on Thu May 18, 2017 3:11 pm

Are you using tables for layout purposes? If so that's a technique literally from the last century, the correct way is to use divs for layout control.

You shouldn't be thinking of moving the existing posts, but inserting a new one above the existing ones. Whether you used tables or divs for layout this is what you should be doing.

In the case of tables, simply insert another row or table above the top one, in the case of divs, do the same. This is immensly easier in code view than design view.

It would help a great deal is you gave us a link to the site, so we can look at the code and work out what your problem really is, because there is normally nothing to stop you doing this.

Also, if you stick to having older posts at the top and adding new ones at the bottom, the new ones are likely to be missed and not read.

You'd be better using wordpress or blogger if you have met a problem after just three posts...
dr-john
 
Posts: 609
Joined: Wed May 13, 2009 1:37 pm
Location: Kent
Country: Scotland (sp)

Re: Blog Format Issue - Move Multiple Tables/Layers Easily?

Postby psychtrailmix on Fri May 19, 2017 4:54 pm

dr-john wrote:Are you using tables for layout purposes? If so that's a technique literally from the last century, the correct way is to use divs for layout control.

You shouldn't be thinking of moving the existing posts, but inserting a new one above the existing ones. Whether you used tables or divs for layout this is what you should be doing.

In the case of tables, simply insert another row or table above the top one, in the case of divs, do the same. This is immensly easier in code view than design view.

It would help a great deal is you gave us a link to the site, so we can look at the code and work out what your problem really is, because there is normally nothing to stop you doing this.

Also, if you stick to having older posts at the top and adding new ones at the bottom, the new ones are likely to be missed and not read.

You'd be better using wordpress or blogger if you have met a problem after just three posts...


What you're saying makes sense. It's going to be a learning curve for me. To get me started if you could help with one thing, I'd greatly appreciate it: So I have an image on my web page using a layer to place it exactly where I want, how to I get text centered underneath that image using a div? In other words an image of a place, then under it, centered under the image have the location in text?

Also, I tried to insert another table above existing one, but the existing one doesn't easily move in order for me to do that. Is there a way I can create more space at the TOP of the web-page? In other words, how you'd hit "enter" button on keyboard at the bottom of a page and it gives you more room to add more material... is there a similar function for the TOP of the page? If you know a way to do this, it would help me IMMENSELY. Thank you for taking your time to help me.

One more thing - When I add an image and make it a layer to drag where I want to - I place it under a table with text, but when I preview it in a browser there is a gap between the image and the text, is there any way to move it closer to the text and remove the gap between the text and image?

I don't have a link to the site at the moment.. it's not live yet.
Last edited by psychtrailmix on Fri May 19, 2017 4:54 pm, edited 1 time in total.
psychtrailmix
 
Posts: 35
Joined: Tue Jul 07, 2009 10:52 pm
Country: United States (us)

Re: Blog Format Issue - Move Multiple Tables/Layers Easily?

Postby dr-john on Fri May 19, 2017 9:39 pm

Layers

I believe you are using an idea from so long ago that despite my 19 years experience of html, I have never used such a tag!
This link https://en.wikipedia.org/wiki/Layer_element refers to layers and netscape 4, a browser from 1997.
This link http://www.tutorialspoint.com/html/html_layer_tag.htm shows that NO browser supports such a tag.
So I am struggling to help you.

Re space above / below a table - there is infinite space / above below a table, so I can't see why you can't insert a new table or row in a table above or below an existing one. A web page can be as tall / long as you wish - tens of lines of text, or thousands of lines of text (not recommended of course)

To center text in a div with an image in it, use css. Set a css rule based on the id or class of the div - text-align:center;

I strongly suggest that you read a textbook on web design such as the one below, as I think we are speaking a different language when it comes to creating and editing web pages.

https://www.sitepoint.com/premium/books/build-your-own-website-the-right-way-using-html-css-3rd-edition

However I would seriously suggest that you use wordpress or blogger as life will be so much easier for you.
Last edited by dr-john on Fri May 19, 2017 9:39 pm, edited 2 times in total.
dr-john
 
Posts: 609
Joined: Wed May 13, 2009 1:37 pm
Location: Kent
Country: Scotland (sp)

Re: Blog Format Issue - Move Multiple Tables/Layers Easily?

Postby gregtutor on Sat May 20, 2017 8:12 am

Hi psychtrailmix,

I think dr-john has forgotten that many users of KompoZer turn to it because of the reference to WYSIWYG that you see so often on sites discussing the program. He is a coder at heart and I think he has forgotten that in KompoZer it is near impossible, if not impossible, to use point and click techniques to find your way out of a table where there is no other content above it. He has also forgotten that Kompozer uses the term "layer" for what he would call an absolutely positioned <div> tag. However, I agree strongly with his recommendation that you read up on Web design.

You say that you want to control the appearance of your site, but you seem to be ignoring a fundamental difference between writing for the Web and writing for print. With print you control the size of the paper, the size of the text the font used - everything! With the Web you control none of that. People use devices as different as 50" TVs and 3" phones to view Web sites. They adjust text size and colour to allow for their eyesight and they may have a different collection of fonts to those installed on your computer so substitutes will be used on their machine.

As a result your design needs to be flexible enough that it will reflow and reposition your content depending on the device on which it will be viewed. As dr-John suggests, tables are a disaster for this flexibility as they force content into fixed rows and columns that does not allow content to re-flow into a single column on narrow screens. Equally the idea that you can position an image or block of text in a particular position by dragging it (KompoZer will then fix it according to the pixels on your screen) and expecting it to be in an appropriate position on other people's screens, which might be huge landscape screens or narrow portrait screens is simply preposterous.

To allow for all this you need to differentiate between "content" and "styling" and you need to create different styling rules to allow for different sized screens. My own site should help you come to terms with the concepts and how to begin to work with them using KompoZer.

In short, KompoZer is a good tool for learning what'she involved in creating a Web site, but you should not treat it as a "word processor for the web". You need to forget almost everything you ever learnt about word processing. Web design is a very different process.
Last edited by gregtutor on Sat May 20, 2017 8:12 am, edited 4 times in total.
Greg Chapman
http://www.gregtutor.co.uk
Helping new users of KompoZer - but using BlueGriffon
gregtutor
Moderator
 
Posts: 3746
Joined: Wed Jun 20, 2007 8:25 am
Location: The Norfolk Broads, UK
Country: England (en)

Re: Blog Format Issue - Move Multiple Tables/Layers Easily?

Postby psychtrailmix on Wed May 24, 2017 3:17 pm

gregtutor wrote:Hi psychtrailmix,

I think dr-john has forgotten that many users of KompoZer turn to it because of the reference to WYSIWYG that you see so often on sites discussing the program. He is a coder at heart and I think he has forgotten that in KompoZer it is near impossible, if not impossible, to use point and click techniques to find your way out of a table where there is no other content above it. He has also forgotten that Kompozer uses the term "layer" for what he would call an absolutely positioned <div> tag. However, I agree strongly with his recommendation that you read up on Web design.

You say that you want to control the appearance of your site, but you seem to be ignoring a fundamental difference between writing for the Web and writing for print. With print you control the size of the paper, the size of the text the font used - everything! With the Web you control none of that. People use devices as different as 50" TVs and 3" phones to view Web sites. They adjust text size and colour to allow for their eyesight and they may have a different collection of fonts to those installed on your computer so substitutes will be used on their machine.

As a result your design needs to be flexible enough that it will reflow and reposition your content depending on the device on which it will be viewed. As dr-John suggests, tables are a disaster for this flexibility as they force content into fixed rows and columns that does not allow content to re-flow into a single column on narrow screens. Equally the idea that you can position an image or block of text in a particular position by dragging it (KompoZer will then fix it according to the pixels on your screen) and expecting it to be in an appropriate position on other people's screens, which might be huge landscape screens or narrow portrait screens is simply preposterous.

To allow for all this you need to differentiate between "content" and "styling" and you need to create different styling rules to allow for different sized screens. My own site should help you come to terms with the concepts and how to begin to work with them using KompoZer.

In short, KompoZer is a good tool for learning what'she involved in creating a Web site, but you should not treat it as a "word processor for the web". You need to forget almost everything you ever learnt about word processing. Web design is a very different process.


Thanks so much for your reply. And the concept you lay out makes sense. And your site looks incredibly informative and easy to follow, I will be delving into it and learning for sure! Thanks again.
psychtrailmix
 
Posts: 35
Joined: Tue Jul 07, 2009 10:52 pm
Country: United States (us)

Re: Blog Format Issue - Move Multiple Tables/Layers Easily?

Postby psychtrailmix on Wed May 24, 2017 4:07 pm

dr-john wrote:Are you using tables for layout purposes? If so that's a technique literally from the last century, the correct way is to use divs for layout control.

You shouldn't be thinking of moving the existing posts, but inserting a new one above the existing ones. Whether you used tables or divs for layout this is what you should be doing.

In the case of tables, simply insert another row or table above the top one, in the case of divs, do the same. This is immensly easier in code view than design view.

It would help a great deal is you gave us a link to the site, so we can look at the code and work out what your problem really is, because there is normally nothing to stop you doing this.

Also, if you stick to having older posts at the top and adding new ones at the bottom, the new ones are likely to be missed and not read.

You'd be better using wordpress or blogger if you have met a problem after just three posts...


"You shouldn't be thinking of moving the existing posts, but inserting a new one above the existing ones. Whether you used tables or divs for layout this is what you should be doing.

In the case of tables, simply insert another row or table above the top one, in the case of divs, do the same. This is immensly easier in code view than design view."


How do I do this?
psychtrailmix
 
Posts: 35
Joined: Tue Jul 07, 2009 10:52 pm
Country: United States (us)

Re: Blog Format Issue - Move Multiple Tables/Layers Easily?

Postby wink0r on Thu May 25, 2017 2:20 pm

This is significantly complicated by the use of layers since they produce absolutely positioned elements.
wink0r
 
Posts: 2583
Joined: Tue Aug 28, 2007 10:10 pm
Location: East Coast - USA
Country: United States (us)

Re: Blog Format Issue - Move Multiple Tables/Layers Easily?

Postby dr-john on Thu May 25, 2017 9:49 pm

Let's assume that you have used a table for layout, even though that is not what tables are for, and that you have positioned your images inside a table cell. And that each post is in a cell of it's own.

Click in the top row of your table.
In the menu select TabLe>Insert>Row Above.
Add new post in this new cell.

BUT
if you have used a table simply to give, let's say, a top header, a side menu and a cell containing ALL of your posts, things get trickier. Your absolute positioning (a method abhored by all web designers as it makes future editing very difficult, and is especially bad if viewers have a smaller screen than you and you built your page with the editor full screen)

You can try the above method, inserting rows above your current content, but please forget absolute positioning of images. Learn the simple concept of floating an image left or right, or even just margin:auto.

Too many beginners try to force things to work their way, often treating the editor as a word processor for the web, not realising the problems they will generate as they invent their own ways of doing things. It really, really is best to read a book like the one mentioned above to get some idea of how web pages and css work.

Would you go take a driving test having taught yourself to drive around a farm field and never been on the road or had a proper lesson? So why try the equivalent with web sites?
Last edited by dr-john on Thu May 25, 2017 9:49 pm, edited 1 time in total.
dr-john
 
Posts: 609
Joined: Wed May 13, 2009 1:37 pm
Location: Kent
Country: Scotland (sp)


Return to General Q & A


Who is online

Users browsing this forum: No registered users and 1 guest