Performed complete re-do of the visual integration of WordPress starting from a fresh classic theme. On the first attempt, I could not integrate the main site’s global style sheet because my understanding of CSS was not deep enough. The first attempt consisted of substantial modification of the WordPress style sheet, making global updates impossible.
The second visual integration starts with the same global style-sheet used by the rest of the site. Relatively modest changes to the WordPress style-sheet were needed to finish the job.
Altered Banner.php, index.php, and footer.php to imitate the positioning of the rest of the site.
Had a hard time getting the side-bar to float. Had to move it from the footer.php into the index.php. Had to make ‘position’ of side-bar ‘static’ rather than ‘absolute’. It would not float while absolute. Had to eliminate the ‘clear’ declaration from the comment id. This prevented the side-bar from floating next to the comment.
For future reference, the Glen’s World footer is needed to extend the star background of the container beyond the header to the bottom of the page.
3/13/2013 Update: To clarify for future reference:
- Header.php in the WordPress themes folder 1) references the site style sheets, 2) opens the site container div, and 3) includes the site banner div;
- Footer.php in the WordPress themes folder 1) closes the site container div and 2) includes the site footer div.
As of this writing, the theme folder is themes/Experimental2Classic which is a copy of the themes/classic folder.
Modified the paralegal internet research page, to display answers to the lab problems after a code is given in a form. Used a php header statement to redirect to the print page if the correct code was given.
I freaked out a little. After doing a lot of work to get this page to work correctly, I tried to print the hand out. The print-out looked nothing like what displayed on screen. The answers were not indented, the font color was missing, the automatic numbers were gone.
Turns out, it was a problem with my stylesheet reference. I had been using
<link rel=”stylesheet” type=”text/css” href=”http://www.glenpritchard.com/css/global-styles.css” media=”screen”>
The problem was ‘media=”screen”‘. I did not know that you can specify different style sheets for printing and on-screen viewing. Specifying ‘media=”screen”‘ means that the style sheet will be used for what is displayed on the screen and not what prints. Using ‘media=”print”‘ will work for printing, but not anything else. To use the same style sheet for all purposes, ‘media=”all”‘ may be used.
W3C has a nice reference about style sheets. It also has a reference about media types.
Update: Because the style sheets are cascading, there was no need to redirect the research page to a separate print template. The same page can be used for screen and print! For future reference, the redirect code, which must go at the top before the <html> tag, looks like this:
I tried to install the fast and secure contact form plug-in and experienced an error message after entering the captcha code. Said that it could not set the cookie’s. I found this page on the subject regarding the same error in a comment captcha plug-in by the same author.
Oddly, I was able to send one message from the form when I switched themes back to the classic theme, added one comment to a random post. But then when I switched back to the custom theme, I got the same error message.
This is vaguely similar to the problem that CoffeeCup HTML editor has in uploading a file to a new folder. It cannot write to the new folder until at least one file has been created there. After the first file is created, it uploads fine.
In any event, I could not get it to work, so I uninstalled it.
I was having a hard time centering an image on a page with the ‘margin:auto’ declaration. I learned that you must add the ‘display:block’ declaration.
The display declaration is described here.
Finished converting the lab questions and answers from Word to HTML. Implemented auto numbering and added hyperlinks.
Added favicon for address bar and favorites menu. Got good help from the Widipedia article about favicon.
Converted all questions and answers for my Capital University internet legal research paralegal class to php pages from MS Word documents. Used ‘before’ pseudo-element to number each question.
Updated the “Legal Associations” section from the Legal Research page.
Here is a very interesting idea for using the before and after property to display the url of an anchor tag.
The classic theme is much easier to modify than the default Kubric theme. To fully integrate into Glen’s World, I needed two layers of wrappers. The classic theme already provides one empty wrapper called rap. I modified that one to create the star background. I created a second wrapper (calling it rap2) to hold the bulk of the posts and the sidebar menu in front of the green background. Bringing it all together requires a good understanding of the “position” style. What helped the most was understanding that “absolute” isn’t! Absolute is relative to the parent container (as long as the parent is not “static”). Also, you need to remember to ‘clear’ the footer. Otherwise, the footer won’t sink to the bottom.
After getting rap centered on the page and the posts sitting next to the sidebar, the rest was pretty easy. Replace the text header with a graphic; replacing the footer with the usual footer, placing the main menu in the left margin, all fell into place.
Posts are formatted by the <p> tag. The classic theme messes with the spacing between lines and letters. This made the text in the main menu look odd. Deleting the modifications to the spacing corrected that problem.