A couple of probs with my new site

[Tim W]

Have uploaded my latest site to www.aisholt.org Bear in mind this is a
charitable and amateur effort. I used the lightweight CMS ' Pluck'
because it doesn't require mySQL so the site will work on the 10Mb free
webspace I got for registering the domain - no hosting charge. I heavily
edited and adapted a free theme from another user. Still have to add a
page or two but there are two things I can't get right:

1. The Gold lettering on the right of each page, the other text
doesn't wrap around it properly. I made a new div called it 'content'
and put the following in the css:

#content {
position: relative;
top: -70px;
float: right;
width: 300px;
margin-left: 10px;
margin-right: 10px;
padding: 0px;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 26px;
text-align: center;
color: #8C7858;
}

But the main text seems to wrap around the empty space below 'content'
after it was moved up 70px. Is this normal behaviour? How should I have
done it?

2. This must be basic. I wanted the Item in the nav menu along the
top which is currently selected to be red to match the page title below
the header picture, so if you are on the page 'Services' services is
Red. Can't seem to do that with the css. Probably easy.

Thanks,

Tim w

 

[dorayme]

www.aisholt.org... two things I can't get right:

1. The Gold lettering on the right of each page, the other text
doesn't wrap around it properly.

Get rid of

position: relative;
top: -70px;

2. This must be basic. I wanted the Item in the nav menu along the
top which is currently selected to be red to match the page title below
the header picture, so if you are on the page 'Services' services is
Red. Can't seem to do that with the css. Probably easy.

Change

#menu a {color: #B1B5B8;

to

#menu a {color: #914042;

 

[Ben Bacarisse]

Have uploaded my latest site to www.aisholt.org Bear in mind this is a
charitable and amateur effort. I used the lightweight CMS ' Pluck'
because it doesn't require mySQL so the site will work on the 10Mb
free webspace I got for registering the domain - no hosting charge. I
heavily edited and adapted a free theme from another user. Still have
to add a page or two but there are two things I can't get right:

1. The Gold lettering on the right of each page, the other text
doesn't wrap around it properly. I made a new div called it 'content'
and put the following in the css:

#content {
position: relative;
top: -70px;
float: right;
width: 300px;
margin-left: 10px;
margin-right: 10px;
padding: 0px;
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 26px;
text-align: center;
color: #8C7858;
}

But the main text seems to wrap around the empty space below 'content'
after it was moved up 70px. Is this normal behaviour? How should I
have done it?

Yes, that's normal. Relative positioning does not alter the flow. As
for fixing it, there's a lot of options but they are all "fragile". For
example, you could lie about the image height, let it overflow its
container, and add a top margin to the text you *don't* want to appear
higher up (i.e. the page title). I'd be inclined not to bother.

2. This must be basic. I wanted the Item in the nav menu along the
top which is currently selected to be red to match the page title
below the header picture, so if you are on the page 'Services'
services is Red. Can't seem to do that with the css. Probably easy.

The CMS gives the currently selected menu item the ID "active" so you
can select it with:

#menu #active a { color: ... }

I've written it like that (with the seemingly redundant #menu selector)
so that this rule will have very high specificity. If I hadn't you'd
have work out how all the rules setting menu item colours interact. If
you can do that, then go ahead and make the rule simpler: having rules
with very high specificity tends to make style sheets very inflexible.

 

[Tim W]

Get rid of

position: relative;
top: -70px;

Change

#menu a {color: #B1B5B8;

to

#menu a {color: #914042;

Ha, Ha, very funny. I know just, just enough to know that you are taking
the piss.

Tim w

 

[Tim W]

Yes, that's normal. Relative positioning does not alter the flow. As
for fixing it, there's a lot of options but they are all "fragile". For
example, you could lie about the image height, let it overflow its
container, and add a top margin to the text you *don't* want to appear
higher up (i.e. the page title). I'd be inclined not to bother.

I wondered if there might be nothing actually wrong.

The CMS gives the currently selected menu item the ID "active" so you
can select it with:

#menu #active a { color: ... }

I've written it like that (with the seemingly redundant #menu selector)
so that this rule will have very high specificity. If I hadn't you'd
have work out how all the rules setting menu item colours interact. If
you can do that, then go ahead and make the rule simpler: having rules
with very high specificity tends to make style sheets very inflexible.

Excellent, thanks, fixed it now with your help. Funny I had attempted
that but got it a bit different and the color changed only while the
mouse button was actually down. Not sure I know what was going on there
but now definitely right.

Tim W

 

[Ben Bacarisse]

Ha, Ha, very funny. I know just, just enough to know that you are
taking the piss.

That's very unlikely given what I've seen of dorayme's posts.

 

[dorayme]

On the home page, for example, presumably Tim is wanting the text "To
the Anglican Parish Church of Aisholt, Somerset,...country church." to
go under the "O Lord..." where there *seems* to be room.

Yes, that's normal. Relative positioning does not alter the flow. As
for fixing it, there's a lot of options but they are all "fragile". For
example, you could lie about the image height, let it overflow its
container, and add a top margin to the text you *don't* want to appear
higher up (i.e. the page title). I'd be inclined not to bother.

I agree. You could perhaps alter the html and have the gold abs
positioned relative to the div the bg pic is in. This would involve
scrubbing your

<div id="content">
<p>O Lord Open Thou Our Lips<br>And Our Mouth Shall Show forth Thy
Praise</p>
</div>

altogether and associated css and doing the equivalent of:


<div id="logo" style="position: relative;">
<h1>All Saints Church Aisholt</h1>
<p style="position: absolute; bottom: -1em; right:0;font-size: 1.2em;
padding: 0; width: 15em; text-align: left;">O Lord Open Thou Our
Lips<br>And Our Mouth Shall Show forth Thy Praise</p>
</div>

Just a thought. It places the psalmic words pretty well where they are
intended to be for most folk, and is simpler and does not interfere
with the text below. I removed centre aligning but that is my taste.

btw:

* The footer is too small to read when all else is comfortable.

* Best to use em or % for font-size rather than px.

* Consider marking up the services dates as a UL

 

[Tim W]

Actually, no, Tim. I might have got it wrong but not my style to do
this to you. Just thought you overlooked a colour style and wanted all
to be red in the menu. Sorry.

Is it that whatever page you are on, the menu item referring to the
page you are on should be red? This is what I have done for such
things:

* At the top of the document for say the home page:

<?php $thisPage="index"; ?>

* In an includes (or you can just have the menu html in full in each
doc) something like:

<ul>

<li<?php if ($thisPage=="index") echo " id=\"currentpage\""; ?>"><a
href="index.php">Home</a></li>

...

</ul>

The style for this being something like

#currentpage a {
color: #c00;
background: ...;
text-decoration: underline;
}

If you don't want to be so auto, you can simply relocate the id to the
current menu item in the nav list on each page and not use php. On a
Mac, select and drag!

Anyway, I hope this does not misunderstand you again? At least about
the colour question?

My mistake then. Sincere apologies. Your help is greatly valued.

Tim w

 

[Tim W]

On the home page, for example, presumably Tim is wanting the text "To
the Anglican Parish Church of Aisholt, Somerset,...country church." to
go under the "O Lord..." where there *seems* to be room. Exactly that.

I agree. You could perhaps alter the html and have the gold abs
positioned relative to the div the bg pic is in. This would involve
scrubbing your

<div id="content">
<p>O Lord Open Thou Our Lips<br>And Our Mouth Shall Show forth Thy
Praise</p>
</div>

altogether and associated css and doing the equivalent of:


<div id="logo" style="position: relative;">
<h1>All Saints Church Aisholt</h1>
<p style="position: absolute; bottom: -1em; right:0;font-size: 1.2em;
padding: 0; width: 15em; text-align: left;">O Lord Open Thou Our
Lips<br>And Our Mouth Shall Show forth Thy Praise</p>
</div>

Just a thought. It places the psalmic words pretty well where they are
intended to be for most folk, and is simpler and does not interfere
with the text below. I removed centre aligning but that is my taste.

Thanks. I will take a look at that when I have some time later.

btw:

* The footer is too small to read when all else is comfortable. Okay, Yes.
* Best to use em or % for font-size rather than px.

I sort of knew that but I didn't write the theme from scratch and just
left that as it was. The theme started life at www.freecsstemplates.org
, was turned into a theme by someone else and then butchered by me for
my own use.

* Consider marking up the services dates as a UL

You will have to explain that. Do you mean ul instead of a table?

Thanks,

Tium W

 

[dorayme]

On 07/02/2012 02:10, dorayme wrote: ....

I noted later that you had solved this problem with Ben B's help.
Excellent.

Been a bit distracted with work today, my clients simply do not
understand the pressures of usenet and if they want changes to their
sites or to artwork I try to startle and amaze them with my promptness
so that they have vivid *memories of their resulting feelings of
satisfaction* to counter any possible pain they feel when I finally
get around to billing them - not that I am that expensive, mind you,
but if they are anything like me, paying anyone anything for anything
hurts a lot... shopkeepers around here know to administer valium to
force me to let go of notes bigger than $20, my fingers seem not to
want to let go, it is so embarrassing!

 

[dorayme]

On 07/02/2012 04:12, dorayme wrote:

You will have to explain that. Do you mean ul instead of a table?

No, I refer just to the welcome page, only really looked at that.

<p>Services are held ... as follows:</p>

<p style="padding-left: 30px;">First Sunday of the month (1st - 7th)
- Holy Communion 11.00am<br />Second Sunday of the month (8th - 14th)
- Mattins (Morning Prayer) 11.00am<br />Third Sunday of the month
(15th - 21st) - Mattins 11.00am<br />Fourth Sunday of the month (22nd
- 28th) - Mattins 11.00am<br />Fifth Sunday of the month (29th - 31st)
- Benefice Service not necessarily at Aisholt</p>


<ul>
<li>First Sunday ...Communion 11.00am</li>
<li>Second Sunday ... 11.00am</li>
....
</ul>

and style to suit, perhaps no bullets, a bit more bottom margin than
the default to the list elements is often needed, otherwise it should
just look right with little else, you can limit the width in ems for
neatness if you judge it needs so.

This might just be me, but I would let the text in the table, now that
I *am* glancing at your services page, be a bit bigger and lose the
red. That splash of red in the relevant menu item and the heading
Services, is just right and nice but no more imo. If you want to
distinguish the table headings and dates, bolding or capitals should
be just enough.

Again, imo, just saying: the drawback of black as bg is that it seems
to bleed into the white and red, bolding in white text never quite
looks as good to me as black text on white. I tend to make tables
whitish or at least lightish bg and text black or at least quite dark.
THs are usually bolded by default... hang on ...I better actually look
at your table markup.

mmm... I don't think using TDs and H4s and H5s such a good idea
(probably not your markup), better to use THs and TDs and style if you
don't like the defaults (which is usually bold for TH). Using heading
elements this way seems to me to be semantically iffy...

I better go watch a movie to wind down for the day...

 

[Tim W]

No, I refer just to the welcome page, only really looked at that.

<p>Services are held ... as follows:</p>

<p style="padding-left: 30px;">First Sunday of the month (1st - 7th)
- Holy Communion 11.00am<br />Second Sunday of the month (8th - 14th)
- Mattins (Morning Prayer) 11.00am<br />Third Sunday of the month
(15th - 21st) - Mattins 11.00am<br />Fourth Sunday of the month (22nd
- 28th) - Mattins 11.00am<br />Fifth Sunday of the month (29th - 31st)
- Benefice Service not necessarily at Aisholt</p>


<ul>
<li>First Sunday ...Communion 11.00am</li>
<li>Second Sunday ... 11.00am</li>
...
</ul>

and style to suit, perhaps no bullets, a bit more bottom margin than
the default to the list elements is often needed, otherwise it should
just look right with little else, you can limit the width in ems for
neatness if you judge it needs so.

This might just be me, but I would let the text in the table, now that
I *am* glancing at your services page, be a bit bigger and lose the
red. That splash of red in the relevant menu item and the heading
Services, is just right and nice but no more imo. If you want to
distinguish the table headings and dates, bolding or capitals should
be just enough.

Again, imo, just saying: the drawback of black as bg is that it seems
to bleed into the white and red, bolding in white text never quite
looks as good to me as black text on white. I tend to make tables
whitish or at least lightish bg and text black or at least quite dark.
THs are usually bolded by default... hang on ...I better actually look
at your table markup.

Thanks, I am taking a look at those things, stil tweaking here and there.

mmm... I don't think using TDs and H4s and H5s such a good idea
(probably not your markup), better to use THs and TDs and style if you
don't like the defaults (which is usually bold for TH). Using heading
elements this way seems to me to be semantically iffy...

I better go watch a movie to wind down for the day...

I know what you mean. The table - the reason for my query about table
editors was this table too - I need to receive the monthly schedule from
the old boy who arranges them as an Excel file. I want a quick simple
procedure for copy paste, save as html, copy&paste again.. whatever ...
and it goes into the tinymce editor which the cms uses for editing and
saving content. That implementation of tinymce has Headings 1-5 on the
drop-down style list but doesn't have any table editing buttons, for
that I would need to open the html as text. So there it is, if I can't
do it in 30 secs it will get to be a drag to insert the table and do the
same style edit every month.

Tim W

 

[dorayme]

On 07/02/2012 10:48, dorayme wrote: ....

I know what you mean. The table - the reason for my query about table
editors was this table too - I need to receive the monthly schedule from
the old boy who arranges them as an Excel file. I want a quick simple
procedure for copy paste, save as html, copy&paste again..

If a spreadsheet is saved as a CSV text file (file.csv) and thrown
onto the server, a php script at the place in your HTML doc where you
want the table will do the deed. You can either save it as CSV
yourself or have the person submitting the schedule do it. Then all
you need do is load the CSV file to the server and maybe tweak the php
script to suit and load that up too.

Anyway, here is an example of one of old use of this sort of thing:

The CSV file called file.csv has:

row1 cell1 text...,row1 cell2 text...
row2 cell1 text...,row2 cell2 text...
row3 cell1 text...,row3 cell2 text...
....

(real text content of the cells is to be substituted for the words
'row1 cell1 text...'...)

And the php (that generates a two col table):

<?php

$filename = "file.csv"; //here's the filename

$id = fopen($filename, "r"); //open the file
while ($data = fgetcsv($id, filesize($filename))) //start a loop
$table[] = $data; //put each line into its own entry in the $table
array
fclose($id); //close file

echo "<table id=\"spreadsheet\" cellspacing=\"0\">";

echo "<tr><th>TOPIC</th><th>REFERENCE</th></tr>";

foreach($table as $row)
{
echo "<tr>";
foreach($row as $data)
echo "<td>$data&nbsp;</td>";
echo "</tr>\n";
}

echo "</table>\n";

?>