Jump to content

PicnicTutorials

Advanced Member
  • Posts

    1,108
  • Joined

  • Last visited

  • Days Won

    1

Posts posted by PicnicTutorials

  1. You are very kind. I already put in a class called .info and applied it to the text I want in the tooltip. But now I've somehow lost all my image maps links and the tooltip info instead of appearing as a tooltip, appears at the bottom of the page.

    I'll keep trying later, I have to go out. Thank you

    you can see my CSS and the way I put it in

    http://writetv.okstate.edu/hovertest2.html

     

    I believe you mistakenly deleted before your . That fixed some of it for me. However, I've never worked with area maps so who knows...

     

    And I don't even know if you can add CSS tooltips to the image map? You could easily add the title tag like so though - that works!

     

    title="tooltip"

  2. Alright, I'm getting better at this PHP stuff than I thought. I added it all - the phone one (A-Z a-z), all the $comments ones (url=, link=, http://), and the 2 + 2 = ?. It all works perfect! That "should" help a lot. Thanks Everyone for you help! :)

  3. No doubt, once you do it, it's most likely very easy. But I just think it's funny that both tuts say it's very easy, yet it would take an hour just to read through all the steps. :lol:

    Building Custom WordPress Theme

    advertisement

     

    This is the Chapter II of the Complete WordPress Theme Guide series. This chapter will show you how to build a custom WordPress theme. Although the Codex site provides very good documentations on how to create a theme, but I find it too complicated for a beginner. In this tutorial, I will explain the basics of how WordPress theme works and show you how to convert a static HTML template into a theme. No PHP skill is required, but you need Photoshop and CSS skills to create your own design.

    1. The Blog Frontend

     

    Before you start, let?s take a look at the WordPress default theme and see how it is structured. Take note of the elements (header, post title, search form, navigation, footer, etc.).

     

    default homepage Default Frontpage (index.php)

     

    default homepage Default Single (single.php)

    2. Photoshop Mockups

     

    Based on the information gathered from the default theme, design a Photoshop mockup of your blog. Here I?m using GlossyBlue, one of my free WordPress themes, as an example. Download the demo.zip to see the Photoshop file.

     

    default homepage

    3. HTML + CSS

     

    After the PSD design is done, create a static HTML+CSS template of each page. You can use my GlossyBlue HTML files in the demo.zip to follow this tutorial. Extract the zip and take a look at the index.html, single.html, and page.html. Later in the tutorial, I will use these HTML files and convert them into a theme.

     

    default homepage

    Why Create a Static HTML File First?

     

    Mainly because it will make the development process a lot easier. I usually create a HTML file for every template that I need, test it across all browsers, validate both HTML and CSS markups, then all I have to do is cut & paste the WordPress code. By doing so, I don?t have to worry about HTML or CSS bugs during my theme making process.

    4. How WordPress Theme Works

     

    If you go the default theme folder (wp-content/themes/default), you should see many PHP files (called template file) and one style.css file. When you are viewing the front page, WordPress actually uses several template files to generate the page (index.php

     

    how theme works

     

    For more details, check out Site Architecture and Template Hierarchy at Codex.

    5. Duplicate The Template Files

     

    Copy the GlossyBlue HTML folder into the wp-content/themes folder. Then, go to the default theme folder, copy the comments.php and searchform.php file to the glossyblue folder.

     

    copy files

    6. Style.css

     

    Go to the WordPress default theme folder, open the style.css file. Copy the commented code at the top and paste it to the GlossyBlue style.css file. Change the theme name and the author information as you desire.

     

    theme name and author's information

    7. Splitting The Files

     

    Now you need to understand where to split the file into several files: header.php, sidebar.php, and footer.php. The image below shows a simplified version of my index file and how the markups should split.

     

    splitting files

    8. Header.php

     

    Open the index.html file. Cut from the top to where the ends, paste it in a new PHP file, and save the file as header.php.

     

    header code

     

    Go to the default theme folder, open the header.php. Copy and replace the tags where it requires PHP code (Template Tag):

    , <link> stylesheet, <h1>, and <div class="description">.<p> </p> <p>replace code</p> <p>Navigation Menu (wp_list_pages)</p> <p> </p> <p>Replace the </p> <li> tags in the <ul id="nav"> with <?php wp_list_pages('sort_column=menu_order&depth=1&title_li=');?><p> </p> <p>replace code</p> <p> </p> <p>Reference: wp_list_pages.</p> <p>9. Sidebar.php</p> <p> </p> <p>Back to the index.html file, cut from where the </p> </ul> <form id="searchform"> start to the closing tag of <div id="sidebar"> and paste it in a new PHP file, save it as sidebar.php.<p> </p> <p> * Replace the </p> <form id="searchform"> wrap with <?php include (TEMPLATEPATH . '/searchform.php'); ?>.<p> * Replace the category </p> <li> tags with <?php wp_list_categories('show_count=1&title_li='); ?><p> * Replace the archive </p> </li> <li> tags with <?php wp_get_archives('type=monthly'); ?><p> </p> <p>sidebar</p> <p> </p> <p>References: wp_list_categories and wp_get_archives.</p> <p>10. Footer.php</p> <p> </p> <p>Back to the index.html file, cut from the </p> <div id="footer"> tag to the end of </div> </li> </form> </div> </form> </li> </div> </h1>
  4. You can still "view source" from the Firefox Web Developer toolbar with no pop up message.

     

    Yes, the intent is not to stop anyone from taking anything (that's not possible). The intent is to simply warn (edit- discourage is a better word) them from doing so.

  5. See this is the stuff I keep getting recently. A human I think? Unless bots put names in now too...

     

    Kim to me

     

    This message was sent from:

    http://ww w.visibi lityin herit.com/cont act.php

     

    Name: Kim

     

    Phone: PfKNsawPeid

     

    Email: ki23 566@gm ail.com

     

    Website: ht tp://blo gs.mail. ru/mail/yuri 3525

     

    Comments: he said, stubbornly happen if I let her wake? She'd runregistered sex offenders in my area

     

    give her the choice?"listened she'd believe me?Will. You must know that.I, well... I don't http://blogs .mail.ru/mail/yu ri3525/5410 584861FF F173.h tml

  6. Alright, I think I covered my basis pretty well. I have the copyright in place on the bottom of each page with a firm (assessable) popup window/message. It's a tables mess so it took awhile. And if you try and right click on the text you get the same message. I would have just linked to a new page for the copyright, but I don't have a new flash menu to go along with it. Plus, the whole site is popup windows - wanted to stay true to the look and feel. That's my personal little message in there. No legal mumbo jumbo - just strait talk - but it has a lawyer flare to it I think. http://w ww.buil dingbloc kshom eday care.co m

  7. An image is display inline by default. So text-align:center will center it. Both of these center it everywhere.

     

    Sticky Footer at Bottom

    .center {

    display:block;

    margin:0 auto;

    }

    p {

    text-align:center;

    }

     

  8. That is a good idea' date=' and thanks for the link! If I went that route, instead of the 2 plus 2 route, would the code be the same (i.e. if ($spam == green) )? With this code, is green case sensitive?[/quote']

     

    I probably wouldn't suggest route, simply because of language difficulties. If you do want to do that, I'd actually use the full script, since it (apparently) includes language options for non English speakers.

     

    True...

  9. There are some captchas that are not difficult to read. I think the one on my site is pretty easy on the eyes. And I think the idea there (using the images) is that computers can't "read" the images so it must be a real person filling in the form. (I know you know that...just thinking aloud here ;) ). Anyway, instead of using math problems, what about answers to simple questions like, "What color is grass?" or "What color is snow?", or "Is fire hot or cold?" I've seen some use that kind of thing...

     

    Have you checked out Mike Cherim's contact form script?

     

    ETA: Oops! Here's a more current version.

     

    That is a good idea, and thanks for the link! If I went that route, instead of the 2 plus 2 route, would the code be the same (i.e. if ($spam == green) )? With this code, is green case sensitive?

  10. After reading over your posts, so far, I'm thinking I'm just going to add a field that asks 2 plus 2, and then add your no link cleaner. That should take care of most with minimal work on my part and minimal work on the users part. Thanks a lot!

  11. Cool, I just saw you edit! Thank you Ben, that is very helpful code - exactly what I need! I still know next to nill when it comes to PHP. So, I'll post back if I can't figure it out. I "should" be able to get by by trial-and-error. We'll see...

  12. Awesome - thanks! I'll try and piece together that into my form. If I run into trouble I'll let you know.

     

    Question though, what do you think? Why the elaborit spam control most have. You know, all the letters you can hardly read. Can a bot add 2 plus 2? Because if it's a human spamming then it doesn't matter. So... if they "can" add 2 plus 2 then would it be better to use an image of 2 plus 2 instead. Not very assesable though I'd imagine. Or should I do a slightly harder question, like 15 divided by 3? Thought...?

  13. Do you get actual spam (as in real content)? For a while I kept getting someone just entering stuff like:

     

    Name: fldj;jl;sjklfjslfjd;as

     

    Email: dfjkldkfjdlj@ldjdfljdl.com

     

    (both required fields) -- but I only got maybe 5 of those silly things. I't using tectite, btw.

     

    Hi Thelma,

     

    I wouldn't mind those kind so much. That's probably people just testing out the form. But I keep getting the same kind of spam. I think my form has been put on a easy spammer list or something. I keep getting the kind that has links in the comments section to porn sites and stuff. Makes me think they're using my form to spam others.

  14. I'm getting spammed to death. Ben gave me this solution in the old forum a while ago, but I never wrote it down - and I can't find it.

     

    I just want to add something simple to my form (Like 2 + 3 = ?) I think that should take care of most of the spam bots. Can anyone share the php code to make that happen so that I can add that to my form. So if the answer doesn't equal 5 then it spits back an error. If it does, then the form processes as normal. Let me know if you need to see my script. Thanks! :)

  15. Looks like I may have to take it to the next step with one of them. Whatever that is...? She just kept trying to talk me into why my content should stay on her site. Like talking to a child. You know, the normal "day - care" lady type, 300lbs, mid-America, bordering on retarded. So I simply told her (nicely but firmly), remove it ASAP or I will be forced to take action. Therefore, you will not only have to remove it, but I will also receive damges (money). We'll see...

  16. In the top ten results I have 5 sites that have copied and pasted my "entire" website! All 40 pages! Man... now my hearts all beating fast... That content took me 5 months to write. Everyday from 4am to 7am. Weekends all day. Now I'm peed...

×
×
  • Create New...