Zeki Can - WordPress

  HTML

404 Hata Sayfası Yapımı

  HTML    26 Ocak 2019
Yorum Yok

Web sitelerinde kullanımdan kalkmış url adresleri olabiliyor. Ya da daha yapım aşamasında olan sayfalar. Bugün size sayfanızdaki içeriğin kaldırılmasından dolayı yada kırık bir linkten dolayı daha önce sitenizde bulunan ve sonradan sildiğiniz içerikten dolayı karşımıza çıkan 404 hata sayfasını nasıl oluşturacağımızdan bahsetmek istedim.

Elimde komik olarak bir kaç dosya var. Tabi ne kadar komik olduğu tartışılır. Onları da sayfanın sonunda vereceğim.

WordPress sitenizde öncelikle Yönetici girişimizi yapalım. Tasarım menüsüne tıklayın. Buradan Tema Editörü bölümüne tıklayın. Kullanmış olduğunuz tema üzerinde bulunan 404.php isimli sayfayı editör üzerinde açın. Bu sayfada hata mesajı alanını kendinize göre düzenleyerek kaydetmelisiniz.

404 php sayfanızı mesela alttaki kodları yapıştırın.

<html><head>
<meta http-equiv="content-type" content="text/html; charset=Windows-1254">
<title>404 - ZekiCan.Net - Sayfa Bulunamadı</title>
<meta charset="utf-8">
<script type="text/javascript" src="images/jquery.js"></script>
<script type="text/javascript" src="images/swfobject.js"></script>
<style type="text/css">
/* default */
body {font-family: Helvetica, Arial, sans-serif; font-size:12px; background:#FFF; color:#323232; width:100%; height:100%; overflow:hidden;}
* {margin:0px; padding:0px; list-style:none; outline:none; border:none; text-decoration:none;}

/* clear */
.clear:before,
.clear:after {content:"."; display:block; height:0; overflow:hidden;}
.clear:after {clear:both;}
.clear {zoom: 1;}
/* clear */

#test {position:absolute; width:100%; height:100%; z-index:1;}

#overlay {width:100%; height:100%; position:absolute; background:url('images/video_pattern.png') repeat transparent; z-index:2;}
#con {width:100%; height:100%; position:absolute; z-index:3; background:transparent;}
.inner_con {width:457px; margin:0 auto; padding-top:50px;}
#img {width:457px; height:355px; background:url('images/404_opac.png'); display:block;}

.inner_con .text {padding-top:35px; font-size:14px; width:400px; margin:0 auto;}
.inner_con .text .t1 {float:left; width:270px; font-size:16px; color:#FFF; font-weight:700; padding-top:9px; text-shadow:1px 1px #000;}
.inner_con .text a {display:block; width:120px; margin:0 auto; padding:8px 0; color:#333; border-radius:4px; background:#fff000; font-weight:700; text-align:center;}

</style>
<style media="screen" type="text/css">#test {visibility:hidden}</style></head>
<body>
<div id="con">
	<div class="inner_con">
		<span id="img"></span>
		<div class="text clear">
			<a href="https://zekican.net/">ANASAYFA</a>
		</div>
	</div>
</div>
<div id="overlay"></div>
<object style="visibility: visible;" id="test" data="images/arkaplan.png" type="application/x-shockwave-flash" height="100%" width="100%"><param value="false" name="menu"><param value="transparent" name="wmode"><param value="always" name="allowscriptaccess"><param value="noborder" name="scale"></object>
<script type="text/javascript"> 
var w = $(document).width(),
	h = $(document).height(),
	fvars = {},
	params = {
		menu: 'false',
		wmode: 'transparent',
		allowscriptaccess: 'always',
		scale: 'noborder'
	};
swfobject.embedSWF("images/arkaplan.swf", "test", '100%', '100%', "9.0.0", '', fvars, params);
</script>
</body></html>

Sitenizin image klasörüne de alttaki dosyanın içindekileri atın. bu dosyanın adı arkaplan.png olmalıdır. uzantıyı png olarak değiştirin ve adını arkaplan koyun

images Bu resmi sağ tıklayıp farkı kayıt ederken ismini arkaplan olarak kayıt edebilirsiniz. Ya da kendinize istediğiniz resmi seçip ismini arkaplan.png olarak kayıt edip kullanabilirsiniz.

404 veri bulunamadı sayfa bulunamadı sayfası yapımı
Hata Sayfası Yapımı

Bu işlemleri tamaladıktan sonra web tarayıcınızın url kısmına

http://www. sitenizin adı.com/404 

yazın ve enterlayın.

 

Ve oluşturduğumuz hata sayfası karşınızda. Kodlarda oynama yaparak kendi istediğiniz düzenlemeleri yapabilirsiniz. Kolay gelsin. Altta bir kaç dosya daha bırakıyorum. Onları da deneyebilirsiniz.

Alttaki kodu yine 404.php sayfanıza yapıştırın.

<html><head>
<meta http-equiv="content-type" content="text/html; charset=Windows-1254">
<title>404 - ZekiCan.Net - Sayfa Bulunamadı</title>
<meta charset="utf-8">
<script type="text/javascript" src="images/jquery.js"></script>
<script type="text/javascript" src="images/swfobject.js"></script>
<style type="text/css">
/* default */
body {font-family: Helvetica, Arial, sans-serif; font-size:12px; background:#FFF; color:#323232; width:100%; height:100%; overflow:hidden;}
* {margin:0px; padding:0px; list-style:none; outline:none; border:none; text-decoration:none;}

/* clear */
.clear:before,
.clear:after {content:"."; display:block; height:0; overflow:hidden;}
.clear:after {clear:both;}
.clear {zoom: 1;}
/* clear */

#test {position:absolute; width:100%; height:100%; z-index:1;}

#overlay {width:100%; height:100%; position:absolute; background:url('images/video_pattern.png') repeat transparent; z-index:2;}
#con {width:100%; height:100%; position:absolute; z-index:3; background:transparent;}
.inner_con {width:457px; margin:0 auto; padding-top:50px;}
#img {width:457px; height:355px; background:url('images/404_opac.png'); display:block;}

.inner_con .text {padding-top:35px; font-size:14px; width:400px; margin:0 auto;}
.inner_con .text .t1 {float:left; width:270px; font-size:16px; color:#FFF; font-weight:700; padding-top:9px; text-shadow:1px 1px #000;}
.inner_con .text a {display:block; width:120px; margin:0 auto; padding:8px 0; color:#333; border-radius:4px; background:#fff000; font-weight:700; text-align:center;}

</style>
<style media="screen" type="text/css">#test {visibility:hidden}</style></head>
<body>
<div id="con">
	<div class="inner_con">
		<span id="img"></span>
		<div class="text clear">
			<a href="https://zekican.net/">ANASAYFA</a>
		</div>
	</div>
</div>
<div id="overlay"></div>
<object style="visibility: visible;" id="test" data="images/arkaplan.swf" type="application/x-shockwave-flash" height="100%" width="100%"><param value="false" name="menu"><param value="transparent" name="wmode"><param value="always" name="allowscriptaccess"><param value="noborder" name="scale"></object>
<script type="text/javascript"> 
var w = $(document).width(),
	h = $(document).height(),
	fvars = {},
	params = {
		menu: 'false',
		wmode: 'transparent',
		allowscriptaccess: 'always',
		scale: 'noborder'
	};
swfobject.embedSWF("images/arkaplan.swf", "test", '100%', '100%', "9.0.0", '', fvars, params);
</script>
</body></html>

Php sayfanızı ekledikten sonra sitenizin kök klasöründe bulunan images klasörünüze alttaki dosyanın içindekileri eklemelisiniz.

images  klasörü.

 

Hata Sayfası Yapımı
Hata Sayfası Yapımı
73 okunma

Etiketler : , , ,

  Benzer Yazılar


  Yorumlar

Bir Cevap Yazın

E-posta hesabınız yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Bu yazıya henüz yorum yapılmamıştır, yazı hakkındaki düşüncelerinizi paylaşmaktan çekinmeyin.

  Arama Yap

  Arşivler