?

Log in

No account? Create an account
Got Milk?
Posted on Tuesday 1 January 2002 at 12:23 pm

Layout for mladyhuntingdon, based on Hogan's Heroes Steel Layout

This is a private layout, not for general use. For the public, general use layout on which it is based, see here.

  1. Save the images for the layout to a photo hosting site. If you don't know how to do this, leave a comment and I'll explain.
    1. Background
    2. Header Ignore as you've got the header already.
    3. Separator

  2. Go to the LJ Customization Wizard.
    1. Edit Titles: This can be whatever you want it to be.

    2. Select a New Theme: Search for "Expressive" and click "Apply Theme" on the first result.

    3. Choose a Page Setup: Click "Apply Theme" under "2 Column (Sidebar on Left)." If you have ads, I tested this on Horizontal Placement but it might work with others.

    4. Click "Customize Selected Theme."

  3. You are on the "Display" tab of the "Customize Your Theme" page. You can set whatever values you want for anything on this page.

  4. On the left side of the "Customize Your Theme" page, select "Text." You can put whatever text you want on this page. For the preview, I changed "Recent Entries" to "Daily Reports," "Friends" to "Roll Call," "User Information" to "Prisoner's File," "Archive" to "Camp Records," got rid of the word "This" on Track and Untrack because I find it pointless, got rid of the spaces before and after the // on the comments link text, and did not change anything else. Feel free to change whatever you want and be as creative or not as you'd like. You can change any of this as often as you'd like.

  5. On the left side of the "Customize Your Theme" page, select "Sidebars." You can do whatever you want with this page as well. Select the elements and text you'd like in your sidebar and the order of the elements. You can change any of this as often as you'd like.

  6. On the left side of the "Customize Your Theme" page, select "Links List." Do whatever you want with this one as well. You can change any of this as often as you'd like.

  7. On the left side of the "Customize Your Theme" page, select "Custom CSS."
    1. Set "Use layout's 'Base Weblog' stylesheet(s)" to "No." (VERY IMPORTANT!!)

    2. Ignore the next question.

    3. Select and copy all the text in the scroll box below. Paste that text in the large "Custom Stylesheet" text box.

      CSS:
      /* ----- For mladyhuntingdon ----- */
      /* --- Expressive Layout by BrattyJedi --- */
      /* ----- http://bratty-jedi.livejournal.com/2002/01/01/ ----- */
      
      
      
      /* ----- Main Layout ----- */
      /* ----- Main Layout ----- */
      /* ----- Main Layout ----- */
      
      body {
         margin: 0px;
         font-family: Georgia, serif;
         font-size: 12px;
         text-align: left;
         background: url(HTTP://BACKGROUND) repeat center scroll #666633;
         }
      #container {
         position: relative;
         width: 820px;
         margin: 0px auto;
         background: #35351b;
         padding: 10px 0px;
         }
      #page {
         width: 800px;
         margin: 0px auto;
         background: #5e683a;
         }
      #header {
         border-top: 1px solid #35351b;
         margin: 0px auto 10px auto;
         padding: 0px;
         text-align: center;
         height: 400px;
         width: 800px;
         background: url(http://pics.livejournal.com/mladyhuntingdon/pic/0000929a) center top no-repeat transparent;
         overflow: hidden;
         }
      #header-inner {
         height: 400px;
         width: 800px;
         }
      #alpha {
         left: 195px;
         width: 605px;
         }
      #alpha-inner {
         width: 585px;
         margin: 0px 10px 0px 10px;
         }
      #beta {
         left: -605px;
         width: 195px;
         text-align: center;
         }
      #beta-inner {
         width: 175px;
         margin: 0px 10px 0px 10px;
         overflow: hidden;
         }
      .stream-footer, .stream-header {
         margin: 0px;
         list-style: none;
         text-align: left;
         text-transform: capitalize;
         line-height: 175%;
         font-size: 13px;
         color: #35351b;
         }
      
      
      
      
      /* ----- Fonts ----- */
      /* ----- Fonts ----- */
      /* ----- Fonts ----- */
      
      a, a:link, a:visited, a:active {
         color: #991100;
         text-decoration: none;
         font-weight: bold;
         }
      a:hover {
         color: #991100;
         text-decoration: underline;
         }
      
      .ljuser {
         text-transform: capitalize;
         }
      
      blockquote, q {
         display: block;
         padding: 10px;
         margin: 5px 15px 5px 15px;
         border: double 5px #1c2127;
         display: inline-block;
         }
      .asset-body ul, .asset-body ol {
         border-left: 2px dotted #1c2127;
         border-bottom: 2px dotted #1c2127;
         padding: 5px 5px 5px 30px;
         margin: 10px 10px 10px 10px;
         display: inline-block;
         }
       dl {
         padding: 5px 5px 5px 10px;
         margin: 10px 10px 10px 10px;
         display: block;
         }
      
      dt {
         margin: 0px 10px 0px 0px;
         padding: 0px;
         line-height: 200%;
         font-size: 14px;
         font-weight: bold;
         display: block;
         }
      
      dd {
         margin-left: 25px;
         line-height: 150%;
         display: block;
         }
      
      code {
         font-family: monospace;
         border: 2px dotted #1c2127;
         padding: 10px;
         display: block;
         }
      
      kbd, pre, tt {
         font-family: monospace;
         }
      
      textarea, select {
         border: 0px solid #1c2127;
         background: #999966;
         }
      
      input {
         border: 0px solid #1c2127;
         background: #999966;
         padding: 3px;
         }
      
      #subject {
         border: 0px solid #1c2127 !important;
         background: #999966 !important;
         }
      
      #qrform , #qrform table {
         border: 0px solid #1c2127 !important;
         background: #1c2127 !important;
         color: #f0e3be !important;
         width: 100% !important;
         margin: 10px 0px 10px 0px;
         }
      #qrform a, #qrform a:link, #qrform a:visited, #qrform a:active {
         color: #991100;
         text-decoration: none;
         font-weight: bold;
         }
      #qrform a:hover {
         color: #991100;
         text-decoration: underline;
         }
      #postform {
         border: 0px solid #1c2127 !important;
         background: #1c2127 !important;
         color: #f0e3be !important;
         width: 100% !important;
         margin: 25px 0px;
         }
      
      #commenttext {
         }
      
      
      
      
      /* ----- Header ----- */
      /* ----- Header ----- */
      /* ----- Header ----- */
      
      #header-name {
         margin: -360px 0px 10px 200px;
         font-size: 18px;
         font-weight: bold;
         line-height: 102%;
         }
      #header-name a, #header-name a:link, #header-name a:visited, #header-name a:active, #header-name a:hover {
         color: #000000;
         }
      #header-description {
         margin-left: 200px;
         font-size: 14px;
         font-weight: bold;
         line-height: 102%;
         }
      ul.nav {
         list-style-type: none;
         margin: 367px 0px 0px 0px;
         padding: 0px;
         }
      ul.nav li {
         display: inline;
         margin: 0px 15px 0px 15px;
         font-size: 16px;
         font-weight: bold;
         }
      ul.nav li.current a, ul.nav li.current a:link, ul.nav li.current a:visited, ul.nav li.current a:active  {
         text-decoration: none;
         font-weight: bold;
         padding: 0px 3px 0px 3px;
         line-height: 150%;
         background: #272615;
         color: #939c6d;
         }
      ul.nav li a, ul.nav li a:link, ul.nav li a:visited, ul.nav li a:active {
         text-decoration: none;
         font-weight: bold;
         padding: 0px 3px 0px 3px;
         line-height: 150%;
         background: #35351b;
         color: #939c6d;
         }
      ul.nav li a:hover, ul.nav li.current a:hover {
         text-decoration: none;
         font-weight: bold;
         padding: 0px 2px 0px 2px;
         line-height: 150%;
         color: #35351b;
         background: #939c6d;
         border: 1px dotted #35351b;
         }
      
      
      
      
      
      /* ----- Sidebar ----- */
      /* ----- Sidebar ----- */
      /* ----- Sidebar ----- */
      
      .widget {
         background: #5e683a;
         margin: 0px 0px 15px 0px;
         padding: 0px;
         border: solid #35351b;
         border-width: 0px 2px 2px 2px;
         }
      .widget-inner {
         margin: 0px 0px 5px 0px;
         }
      h3.widget-header {
         border: 0px;
         background: #35351b;
         color: #939c6d;
         padding: 3px;
         margin: 0px 0px 5px 0px;
         text-weight: bold;
         font-size: 13px;
         font-weight: bold;
         list-style: none;
         }
      h3.widget-header a, h3.widget-header a:link, h3.widget-header a:visited, h3.widget-header a:active {
         color: #939c6d;
         font-weight: bold !important;
         font-size: 13px;
         }
      .user-pic img {
         padding: 3px;
         background: transparent;
         border: 2px solid #35351b;
         }
      .profile-list {
         margin: 0px;
         padding: 0px;
         list-style: none;
         }
      .profile-list dd {
         margin: 0px;
         line-height: 150%;
         }
      .calendar-widget table {
         margin-right: auto;
         margin-left: auto;
         }
      .calendar-widget table td {
         text-align: center;
         }
      .calendar-widget .widget-footer {
         padding: 0px;
         margin: -17px 0px -7px 0px;
         }
      .calendar-widget .widget-footer a, .calendar-widget .widget-footer a:link, .calendar-widget .widget-footer a:visited, .calendar-widget .widget-footer a:active, .calendar-widget .widget-footer a:hover {
         font-weight: normal;
         font-size: 11px;
         }
      .typelist-widget .widget-list, .categories-widget .tagcloud, .categories-widget .widget-list, .archive-widget .widget-list {
         list-style: none;
         text-align: left;
         margin: 0px;
         padding: 0px;
         }
      .typelist-widget li, .categories-widget li, .archive-widget li {
         margin: 0px;
         padding: 2px 5px 5px 25px;
         text-indent: -10px;
         }
      .categories-widget .widget-footer a, .categories-widget .widget-footer a:link, .categories-widget .widget-footer a:visited, .categories-widget .widget-footer a:active, .categories-widget .widget-footer a:hover {
         font-weight: normal;
         font-size: 11px;
         text-transform: capitalize;
         }
      
      
      
      
      
      /* ----- Entry ----- */
      /* ----- Entry ----- */
      /* ----- Entry ----- */
      
      .asset {
         margin: 0px;
         padding: 0px;
         }
      
      .user-icon {
         float: left;
         border: solid 2px #35351b;
         margin: 0px 5px 0px 0px;
         padding: 3px;
         text-align: center;
         line-height: 150%;
         background: #transparent !important;
         color: #111111 !important;
         position: relative;
         }
      .asset-header {
         color: #1c2127;
         margin: 0px 0px 15px 0px;
         padding: 0px;
         }
      .asset-header a, .asset-header a:link, .asset-header a:visited, .asset-header a:active, .asset-header a:hover {
         color: #1c2127;
         font-weight: bold;
         margin: 0px;
         padding: 0px;
         }
      h2.asset-name {
         padding: 0px;
         margin: 0px;
         font-size: 16px;
         font-weight: bold;
         color: #1c2127;
         }
      .datetime {
         font-size: 11px;
         color: #1c2127;
         margin: 0px;
         padding: 0px;
         }
      .asset-header .asset-meta-list {
         margin: 0px;
         padding: 0px;
         list-style: none;
         border: none;
         line-height: 120%;
         }
      .asset-header .asset-meta-list li {
         border: none;
         }
      .asset-content {
         min-height: 110px;
         margin: 0px 0px 20px 0px;
         }
      .lj-currents ul{
         margin: 30px 0px 0px 0px;
         padding: 0px;
         list-style: none;
         }
      .entryMetadata-label {
         font-weight: bold;
         font-size: 12px;
         padding: 0px 3px 0px 0px;
         }
      .asset-tags ul{
         margin: 0px;
         padding: 0px;
         list-style: none;
         display: inline;
         }
      .asset-tags li{
         margin: 0px;
         padding: 0px;
         list-style: none;
         display: inline;
         }
      h4.asset-tags-header {
         font-weight: bold;
         font-size: 12px;
         padding: 0px 3px 0px 0px;
         margin: 0px;
         float: left;
         }
      .asset-meta-list {
         margin: 0px;
         padding: 0px;
         display: inline;
         border-right: solid #35351b 1px;
         line-height: 150%;
         font-size: 11px;
         }
      .asset-meta-list li{
         margin: 0px;
         padding: 0px 2px 0px 2px;
         display: inline;
         border-left: solid #35351b 1px;
         }
      .asset-footer {
         height: 80px;
         background: url(HTTP://SEPARATOR) center center no-repeat;
         }
      
      
      
      /* ----- Comments Page ----- */
      /* ----- Comments Page ----- */
      /* ----- Comments Page ----- */
      
      .prevnext {
         margin: 0px;
         list-style: none;
         text-align: left;
         text-transform: capitalize;
         line-height: 175%;
         font-size: 13px;
         color: #35351b;
         }
      .comment {
         margin: 10px 0px 10px 0px;
         color: #35351b;
         }
      .comment-inner {
         padding: 5px;
         }
      .comment-odd {
         border: 2px solid #35351b;
         background: #5e683a;
         }
      .comment-even {
         border: 2px solid #35351b;
         background: #525a32;
         }
      .comment-even .user-icon {
         border: solid 2px #35351b;
         }
      .comment-body {
         min-height: 80px;
         margin-bottom: 10px;
         color: #f0e3be;
         }
      .comment-subject {
         color: #1c2127;
         margin: 0px 0px 5px 0px;
         padding: 0px;
         font-weight: bold;
         font-size: 14px;
         }
      #commenttext {
         width: 510px;
         }
      
      
      
      /* ----- Archives ----- */
      /* ----- Archives ----- */
      /* ----- Archives ----- */
      
      ul.year {
         text-align: center;
         line-height: 150%;
         font-size: 14px;
         margin: 10px;
         }
      
      ul.year li {
         margin: 15px;
         padding: 0px;
         display: inline;
         list-style-type: none;
         }
      
      ul.year li.active {
         text-decoration: none;
         font-weight: bold;
         padding: 0px 3px 0px 3px;
         line-height: 150%;
         background: #272615;
         color: #939c6d;
         }
      
      ul.year a, ul.year a:link, ul.year a:visited, ul.year a:active {
         text-decoration: none;
         font-weight: bold;
         padding: 0px 3px 0px 3px;
         line-height: 150%;
         background: #35351b;
         color: #939c6d;
         }
      ul.year a:hover {
         text-decoration: none;
         font-weight: bold;
         padding: 0px 2px 0px 2px;
         line-height: 150%;
         background: #939c6d;
         color: #35351b;
         border: 1px dotted #35351b;
         }
      table.yeartable {
         width: 75%;
         padding: 5px;
         }
      
      td.yearmonth {
         font-weight: bold;
         line-height: 175%;
         font-size: 15px;
         padding: 0px;
         color: #1c2127;
         }
      
      table.yeartable td.yearday {
         color: #939c6d;
         background: #35351b;
         text-align: center;
         line-height: 150%;
         font-weight: bold;
         }
      
      table.yeartable td.yeardate {
         border: 1px solid #35351b;
         }
      
      
      
      
      
      /* ----- Don't Mess With The Part Below!  ----- */
      #page, #header, #content, #footer {position: relative; top: 0;}
      #alpha, #beta {display: inline; float: left; position: relative; top: 0;}
      #page-inner, #header-inner, #content-inner, #alpha-inner, #beta-inner, #gamma-inner, #footer-inner {position: static;}
      #header-inner, #alpha-inner, #beta-inner, #gamma-inner {overflow: hidden; /* hide content that is larger than the element dimensions */}
      #alpha-inner[id] {overflow: visible;} /* FF MAC & PC will clip pager-top when accessing page anchor */
      .designed-widget, .powered-widget {display: none;}
      /* clear floats, inspired by positioniseverything.net/easyclearing.html */
      .comment-body:after, #page-inner:after, #header-inner:after, #header-photo:after, #content-inner:after, #alpha-inner:after, #beta-inner:after, #gamma-inner:after, #delta-inner:after, #footer-inner:after, .widget .user-pic:after {content: "."; display: block; visibility: hidden; clear: both; height: 0.1px; font-size: 0.1em; line-height: 0.1px;}
      /* float in post bodies around enclosures */
      #content-inner, .asset-body {height: 1%;}
      /* Win IE < 7 */
      * html #header-name a { word-wrap: break-word; }
      /* ----- Don't Mess With The Part Above!  ----- */


  8. In the CSS you just pasted, you need to find and replace three bits of text. Your browser's find function should make this task easier but you can find the text manually as well. You will always be replacing text inside parentheses. Be sure not to delete the parentheses.
    1. At the top of the code, under Main Layout find the code for body and replace HTTP://BACKGROUND with the web address for the background image you saved in step 1.

    2. Still under Main Layout, find the code for #header and replace HTTP://HEADER with the web address for the header image you saved in step 1. Ignore as I laready put in the correct header URL for the one saved in your LJ scrapbook. If you ever want to change an image (or more than one), in the header, just save a copy of the overall image with the new images in place, upload it to a photo hosting site, and replace the url inside the parentheses on #header with the url for the new image.

    3. About two-thirds of the way through the code, right before Comments Page find the code for .asset-footer and replace HTTP://SEPARATOR with the web address for the separator image you saved in step 1.

  9. Be sure to save the changes and you are done.

  10. This step is completely optional, but if you do use this layout, I'd appreciate it if you would post a comment to this entry letting me know and please consider giving credit to myself and others whose work went into this layout. You can do this in one of two ways.
    1. If you include the links list in your sidebar, you can make a LJ entry titled "Layout Credits." Copy the text in the box below and paste it into the LJ entry and save the entry. You are of course welcome to change the text as you see fit. This is just a suggestion on the information you should include. Place a link called "Layout Credits" or something similar linking to the final entry in your sidebar link list.

    2. If you do not use the link list or would prefer not to include a credits link in your link list, you can paste the text below at the end of the "Bio" section on your profile. You can edit your profile here. Again, you are of course welcome to change the text as you see fit. This is just a suggestion on the information you should include.
    Credit Information:
    This LJ layout was designed by <lj user="bratty_jedi">.

    The barbed wire imagery used in this layout was designed by FrozenStarRo and is available <a href="http://ro-stock.deviantart.com/art/Barbed-Brushes-52809135">here</a>.

    The concept for this layout and some of the pictures in the header image came from the TV show <a href="http://www.imdb.com/title/tt0058812/">Hogan's Heroes</a>. No profit is being made from this layout and no copyright infringement is intended. This is simply a tribute to a beloved television comedy.

Comments:

mladyhuntingdon
mladyhuntingdon at 8:10 pm on 28 June 2009 (UTC) (Link)
THANK YOU!!! =cD

(And, credit happily given in bio.)
Rachael
bratty_jedi at 12:03 am on 29 June 2009 (UTC) (Link)
Glad you like it.

Oh, I noticed right now whenever you've got a comment, the link says 1 comment - 2 comments (or some other number). I'm guessing that isn't what you want. It probably means when you were changing things in the Text section of the customization wizard, you got rid of the // in the comment link bit. It should be something along the lines of 1 comment//# comments. Everything before the // is what the computer will use when there is one comment (usually a 1 and a singular noun) and everything after the // is what the computer will use when there is more than one comment (usually a # telling the computer to insert the number of comments and a plural noun). Without the // in there, the computer just prints it all.


   Leave a New Comment
Previous Entry  Next Entry