AP Webpage Framework

responsive rescale from smart-phone to desktop

dead roses
dead roses

Yellow roses are a token of friendship, but my friendship with mainstream social media is dead.

Last updated: 2020-02-21

Theme template

zip Here is a website framework that provides a range of facilities to create a consistent website look and feel, that I call a theme. Clicking that link will download a zip file so you can use it and develop it for non-commercial projects of your own, but I retain the copyright and accept no liability.

Note: You can install it on a server by unzipping it in the http root folder there. If you have other web documents present you might want to check there are no conflicts before doing so.

I will discuss deriving alternative themes later, but they can live side by side as long as you give the main script a different name. You can see in the browser address bar that the theme script (ap.php) is used as were it a folder in the page hierarchy, following that is the topic name and then the post that you are viewing.

Responsive Layout

The design of this theme is intended to be responsive. Which I gather is technicaleeze, meaning it adapts to the display size being used. If you have a large screen you can resize the window right now, to see it in action. My main objective is for an uncluttered consistent presentation that optimizes use of the available window, without needing any special code in the actual page scripts.

Dark and Light theme

Unlike the w3css classes that define individual color classes my css creates a dark theme and a light theme by defining coordinating colors as a set. For individual sections of any page, the colors are chosen with a class attribute of either ap_light or ap_dark. (e.g. the header above is light theme and this section is dark theme).

Presentation of ap classes are defined in the file ap_style.css which is amenable to being cached client side (in the visitor's browser). Additional style elements controlled by php definitions are then added in the main theme script. Alas I was unable to avoid conflict with w3css classes and had to abandon my attempts to remain compatibile for now.

Navigation Menu's

Navigation menus and additional aside documents can drop down from icons which appear in different places, depending on the window size. On the desktop they do not obscure the main document so you can keep them open by clicking the icon to toggle them on or off.

For instance click the Contact icon to see it in action. Note that the Dissenter comment view (if present) is not hosted on my site and I have absolutely no control over what is posted there. Note: You may have to disable shields for this site to allow dissenter to operate in a frame here. That feature is provided by Dissenter for your own protection although I don't try to abuse it any way.

Work in progress

Now head on over to the drop down Index where the available posts in this demo topic are listed. I think I shall organize them in reverse chronological order so that new ones will be added at the top as I write them.

~ enjoy ~