Customization of "Page not found" (Error 404-Page)

Lille UlvenLille Ulven Registered Users Posts: 567 Major grins
edited January 25, 2015 in SmugMug Customization
Hi.

I am trying to do some customisation of my Page not found page...

First of all: adding some html-code to have a direct link to my contact form
<p style="font-size:14pt">You have found a link that does not refer to an existing page.
  Please 
<div class="sm-footer-navitem-contact">
  <font size="5pt"><a href="#" style="color:red">contact me</a> <font></font></div>
<p style="font-size:14pt">to let me know where you found it and which link it is, so that I can correct it. To get back to my homepage please click <a href="http://www.lilleUlven.com" style="color:red">here</a> 
</p>

But adding this additionally to what I have done in customization on that page leads to a few weird things (for those who are not logged in):
1) The photo that you would see now if you tried to access www.LilleUlven.com/cookiemonster will not be shown
2) The menu bar evaporates too
3) The contact form will not show

This mess happens as soon as one adds the <font>-tags around the <a href> for the contact form.
Everything works fine as soon as I remove that font-size change, but then the contact me shows in some little font that looks as if I would be running away from such contacts...

Do you have an idea how to fix this to make it work?

Thanks for your help in advance.

Best regards

Lille Ulven
https://www.lilleulven.smugmug.com - The Photos of my travels

Comments

  • Lille UlvenLille Ulven Registered Users Posts: 567 Major grins
    edited January 25, 2015
    Problem with 404-Page solved
    I've got it fixed now :)
    The solution: move all the style-stuff into the CSS and it will work with these links too. (At least on my machine.)
    So now the html-part looks like this:
    <p>You have found a link that does not refer to an existing page.
    <div class="sm-footer-navitem-contact">
      Please <a href="#">contact me</a> to let me know where you found it and</div>
    <p>which link it is, so that I can correct it. To get back to my homepage please click <a href="http://www.lilleUlven.com" style="color:red">here</a> 
    </p>
    

    And has a CSS attached which looks like this:
    h2 {
    font-size: 22px;
    font-color: red !important;
    text-decoration: underline;
    }
    
    p {
    font-size: 20px;
    color : black !important;
    line-height: 1.5;
    }
    
    div {
      font-size: 20px !important;
      color : black !important;
    }
    
    a:link {
      color: blue !important;
      font-size: 20px !important;
      text-decoration: underline;
    }
    
    a:visited {
      color: red;
      font-size: 20px !important;
      text-decoration: none;
    }
    
    a:active {
      color: red;
      font-size: 20px !important;
      text-decoration: none;
    }
    
    a:hover {
      color: red;
      font-size: 20px !important;
      text-decoration: none;
    }
    

    :ivar
    https://www.lilleulven.smugmug.com - The Photos of my travels
  • ChancyRatChancyRat Registered Users Posts: 2,141 Major grins
    edited January 25, 2015
    Thank you for sharing the code. I was following along with interest but felt I couldn't give an answer because I wasn't sure the "contact me" link was even codable in the html.
  • Lille UlvenLille Ulven Registered Users Posts: 567 Major grins
    edited January 25, 2015
    You're welcome.
    I figured that someone else might some time run into the same problem - so why not put the solution in this thread too :)
    https://www.lilleulven.smugmug.com - The Photos of my travels
Sign In or Register to comment.