Blogger Sıkça Sorulan Sorulan Eklentisi Nasıl Eklenir

Blogger Sıkça Sorulan Sorulan Eklentisi Nasıl Eklenir

Birçok profesyonel web sitesinde görmeye alıştığınız sıkça sorulan sorular eklentisini artık bloggar'da da kullanabileceksiniz. Küçük bir kod eklemesi sayesinde istediğiniz yerde bu eklentiyi kullanabilirsiniz. İster sabit sayfaya isterseniz belirli post'larda SSS bölümü ekleyebilirsiniz.

Sıkça sorulan sorular eklentisi okuyucularınıza profesyonel bir blog yazarı olduğunuz görünümü verecektir ayrıca aradıkları sorulara kolayca erişmelerini sağlayacaktır.

Sıkça sorulan sorular eklentisinde sınırsız sayıda soru ve yanıt ekleyebilirsiniz.

Alternatif olarak daha önceki yazılarımda ZİPPY eklentisini zaten kurduysanız. Zippy ilede SSS sayfası hazırlayabilirsiniz. Biz bu blogta ekstra kod girmemek için SSS sayfamızı Zippy ile oluşturduk. İkisinide inceleyip hangisini kullanacağınıza karar verebilirsiniz.

Blogger sıkça sorulan sorular eklentisi kurulumu

Birinci adım : Blogger hesabınıza giriş yapın kontrol panelinden " Tema > HTML'yi düzenle " yollarını takip ederek blog şablon kodlarınıza ulaşın.

İkinci adım : Blogger şablon kodlarınız içerisinde CTRL+F yardımı ile </head> kodunu atarın ve </head> kodunun bir satır üzerine aşağıdaki CSS kodlarını ekleyin.

CSS KODLARI

<style type='text/css'>
/*<![CDATA[*/
.gs_list_box_container{border:solid 5px #dad8d7;box-sizing:border-box}
.gs_list_box_container *{box-sizing:border-box}
.gs_card_header{display:block;width:100%;background-color:#f2f2f2;line-height:40px;height:40px;font-size:18px;font-weight:bold;cursor:pointer;border-bottom:solid 1px #ddd;padding:0 20px;position:relative}
.gs_card_body{padding:0;display:none}
.gs_card_body a,.gs_card_body p{background-color:#fff;color:#333;display:block;width:100%;font-size:16px;margin:0;padding:10px 20px;border-bottom: 1px solid #ddd}
.gs_card_body a{font-style:italic;text-decoration:none;-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}
.gs_card_body a:hover{background-color:#eee;color:#f08221;}
.gs_card_arrow{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAIVBMVEVHcEx4WgVVQAMcFQEeFgF3WARYQgNWQAN6YAMuJAFjSgD0PZHsAAAAC3RSTlMANsD7+jq6vSbyH6nxLOIAAABRSURBVCjPzc9BDoAwCETRAYq2vf+BFWOIkelaZ/lfWAB8ub7KY2NdB6QR0SZgcnUidy+SPWSn/RRLUZPnecqrp5QOeIia16fclPYQ3oE58ZMdOgEBCuqhN+oAAAAASUVORK5CYII=) no-repeat center;width:24px;height:24px;position:absolute;display:block;right:20px;top:10px;-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out;background-size:16px}
.gs_active .gs_card_arrow{-ms-transform:rotate(180deg);-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.gs_active .gs_card_header{color:#f08221}
.gecmis-sorular-menu li a{font-size:14px}
/*]]>*/
</style>

Üçüncü adım : Blog şablon kodlarınız içerisinden bu kez </body> kodunu aratın ve bir satır üzerine aşağıdaki JavaScript kodlarını ekleyin.

JavaScript KODLARI

<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){$(".gs_active .gs_card_body").slideDown(),$(".gs_card_header").click(function(){var s=$(this).parent().find(".gs_card_body");"block"==s.css("display")?(s.slideUp(),$(this).parent().removeClass("gs_active")):($(".gs_list_box_container .gs_card").removeClass("gs_active"),$(this).parent().addClass("gs_active"),$(".gs_card_body").slideUp(),s.slideDown())})});
//]]>
</script>

Dördüncü adım :  İlk 3 adımı tamamladıktan sonra blogger şablon kod sayfanızı kaydedin. SSS'i sabit sayfada kullanacaksanız aşağıdaki HTML kodlarını yeni bir sıkça sorulan sorular sayfası açık sayfanın HTML kısmına ekleyin. Eğer bir post içinde kullanacaksanız yine aşağıdaki kodları ilgili post'un HTML kısmına ekleyin. Başlık ve içerik kısımlarını isteğinize göre doldurun.

HTML KODLARI

<div class="gs_list_box_container">
<div class="gs_card gs_active">
<div class="gs_card_header">Başlık1<span class="gs_card_arrow"></span></div>
<div class="gs_card_body">
İçerik1
</div>
</div>
<div class="gs_card">
<div class="gs_card_header">Başlık2<span class="gs_card_arrow"></span></div>
<div class="gs_card_body">
<p>İçerik2</p>
</div>
</div>
<div class="gs_card">
<div class="gs_card_header">Başlık3<span class="gs_card_arrow"></span></div>
<div class="gs_card_body">
<p>İçerik3</p>
</div>
</div>
<div class="gs_card">
<div class="gs_card_header">Başlık4<span class="gs_card_arrow"></span></div>
<div class="gs_card_body">
<p>İçerik4</p>
</div>
</div>
<div class="gs_card">
<div class="gs_card_header">Başlık5<span class="gs_card_arrow"></span></div>
<div class="gs_card_body">
<p>İçerik5</p>
</div>
</div>
</div>

Bu şekilde blogger sıkça sorulan sorular sayfasınıda hazırlamış olduk. Aklınıza takılan veya sormak istediğiniz konular hakkında yorum kısmını kullanabilirsiniz.

Ön İzleme

Ön izleme için aşağıki kodları kopyalayıp KOD ÖN İZLEME sayfamızda test ederek inceleyebilirsiniz.

ÖN İZLEME KODLARI

<!DOCTYPE html>
<html>
<head>
<title>JavaScript Akordeon Tablo</title>
<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700');
body {font-family:'Roboto', sans-serif;line-height:1.5}
.gs_list_box_container{border:solid 5px #dad8d7;box-sizing:border-box}
.gs_list_box_container *{box-sizing:border-box}
.gs_card_header{display:block;width:100%;background-color:#f2f2f2;line-height:40px;height:40px;font-size:18px;font-weight:bold;cursor:pointer;border-bottom:solid 1px #ddd;padding:0 20px;position:relative}
.gs_card_body{padding:0;display:none}
.gs_card_body a,.gs_card_body p{background-color:#fff;color:#333;display:block;width:100%;font-size:16px;margin:0;padding:10px 20px;border-bottom: 1px solid #ddd}
.gs_card_body a{font-style:italic;text-decoration:none;-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out}
.gs_card_body a:hover{background-color:#eee;color:#f08221;}
.gs_card_arrow{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAIVBMVEVHcEx4WgVVQAMcFQEeFgF3WARYQgNWQAN6YAMuJAFjSgD0PZHsAAAAC3RSTlMANsD7+jq6vSbyH6nxLOIAAABRSURBVCjPzc9BDoAwCETRAYq2vf+BFWOIkelaZ/lfWAB8ub7KY2NdB6QR0SZgcnUidy+SPWSn/RRLUZPnecqrp5QOeIia16fclPYQ3oE58ZMdOgEBCuqhN+oAAAAASUVORK5CYII=) no-repeat center;width:24px;height:24px;position:absolute;display:block;right:20px;top:10px;-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out;background-size:16px}
.gs_active .gs_card_arrow{-ms-transform:rotate(180deg);-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.gs_active .gs_card_header{color:#f08221}
.gecmis-sorular-menu li a{font-size:14px}
</style>
</head>
<body>
<div class="gs_list_box_container">
<div class="gs_card gs_active">
<div class="gs_card_header">CSS3<span class="gs_card_arrow"></span></div>
<div class="gs_card_body">
</div>
</div>
<div class="gs_card">
<div class="gs_card_header">HTML5<span class="gs_card_arrow"></span></div>
<div class="gs_card_body"><a href="//bloggereklentileri.blogspot.com/2018/06/blogger-html5-meta-etiketleri.html" title="Blogger HTML5 Meta Etiketleri" target="_blank" rel="nofollow noopener">Blogger HTML5 Meta Etiketleri</a></div>
</div>
<div class="gs_card">
<div class="gs_card_header">Blogger İpuçları<span class="gs_card_arrow"></span></div>
<div class="gs_card_body"><a href="//bloggereklentileri.blogspot.com/2018/05/blogger-2018de-yeni-guncellemeler.html" title="Blogger 2018'de Yeni Güncellemeler Yapacak" target="_blank" rel="nofollow noopener">Blogger 2018'de Yeni Güncellemeler Yapacak</a></div>
</div>
<div class="gs_card">
<div class="gs_card_header">Blogger Temaları<span class="gs_card_arrow"></span></div>
<div class="gs_card_body">
<a href="//bloggereklentileri.blogspot.com/2018/05/blogger-teknoloji-ve-magazin-temas.html" title="Blogger Teknoloji ve Magazin Teması" target="_blank" rel="nofollow noopener">Blogger Teknoloji ve Magazin Teması</a>
<a href="//bloggereklentileri.blogspot.com/2018/05/blogger-weblog-temas-haber-magazin-ve.html" title="Blogger WeBlog Teması (Haber, Magazin ve Dergi)" target="_blank" rel="nofollow noopener">Blogger WeBlog Teması (Haber, Magazin ve Dergi)</a>
<a href="//bloggereklentileri.blogspot.com/2018/05/blogger-mahmure-temas.html" title="Blogger Mahmure Teması" target="_blank" rel="nofollow noopener">Blogger Mahmure Teması</a>
</div>
</div>
<div class="gs_card">
<div class="gs_card_header">İş Ve Ev Arasındaki Zorlu Denge: Çalışan Anne Olmak <span class="gs_card_arrow"></span></div>
<div class="gs_card_body"><p>Annelik ve iş yaşamı arasındaki dengeyi kurmak için suçluluk duygusundan da uzaklaşmanız gerek. Önemli olan çocukla 24 saat değil, “nitelikli” vakit geçirmek.
<br><br>
Günümüzde anneler daha önce hiç olmadığı kadar çalışma hayatının içinde. Kuşkusuz bu büyüyen Türkiye ile uyumlu bir olgu. Ancak çalışan annelerin iş ve ev yaşamları arasındaki dengeyi kurmaları bazen oldukça güç oluyor. Çoğu zaman suçluluk duygusu yaşayabiliyorlar ve bu da stres düzeylerini artırıyor. Yapılması gereken şey, annelik ve iş yaşamı arasında bir denge oluşturmak ve daha sonra düzenli ve disiplinli bir biçimde bu dengeyi korumak.
<br><br>
Bu dengeyi koruyabilmek için çalışan annelerin hayatına girmesi ve bir daha çıkmaması gereken bazı kavramlar var: İş planı, program, takvim ve disiplin…   Önemli olan günü doğru planlamak ve uygulayabilmek. Program veya disiplin kadar önemli olan diğer şey de sınır koyabilmek. Bazı insanlar işine tutkuyla bağlıdır ve gece gündüz ayrımı yapmaz. Ancak anne olduysanız artık sınır koymanın vakti gelmiş demektir. İşyerinde de iyi bir planlama yapmalısınız ve mesai saatlerini verimli geçirerek mümkün olduğu kadar işi işte bitirmelisiniz.
<br><br>
Annelik ve iş yaşamı arasındaki dengeyi kurmak için suçluluk duygusundan da uzaklaşmanız gerek. Önemli olan çocukla 24 saat değil, “nitelikli” vakit geçirmek. Çalışan anneler bir kere televizyonu yaşamlarından çıkarmalıdır. Burada da bulabileceğiniz “çocuğunuzla oynayabileceğiniz oyunlar” tarzı makale ve yazılar size TV karşısında zaman geçirmektense, çocuğunuzla nitelikli zaman geçirmenizi sağlayacak etkinlik ve oyunlar konusunda size fikir verecektir.
<br><br>
Çalışan annedeki suçluluk duygusunu azaltmak için çocuğun kime emanet edildiği de önem taşır. Çok şükür, ülkemizde hala geleneksel dayanışma devam ediyor ve anneanneler, babaanneler ve dedeler Hızır gibi imdada yetişiyor! Ama böyle bir imkânı olmayanlar için bakıcı seçimi hayati önem taşıyor. Bakıcı seçiminden önce, evvela bir çocuğun sağlıklı bir bağlanma süreci yaşayabilmesi için annesiyle en azından ilk birkaç ayı birlikte geçirmesi hayati önem taşıyor. Anne adaylarının planlaması gereken en önemli şeylerin başında bu konu geliyor. Bakıcı seçimiyle ilişkili olaraksa, ince eleyip sık dokuyup bir bakıcıya karar vermek ve daha sonra bu bakıcıdan vazgeçmemek gerekiyor. Çocuğun güven duygusunun gelişimi bakımından bu konuya özen gösterilmeli.
<br><br>
Gün içinde annelerin hem bakıcıyla hem de çocukları ile ara fotoğraf ve video paylaşımında bulunarak irtibat halinde olması önemli.
<br><br>
Eve iş getirmemek ve vakti organize bir biçimde kullanmak bir diğer önemli konu. Çocuk uyuduktan sonraki zamanı da iş için değil, kişisel ilgi ve hobiler için ve eşlerle birlikte değerlendirmek gerek. Eşlerle geçirilen zamanı da nitelikli kılmakta fayda var. Örneğin, çocuklar olmadan baş başa yemek veya kahve ritüelleri oluşturulabilir.  Çoğu insan evliliği olduğu gibi yaşıyor ve böylece heyecanını yitiriyor. Hâlbuki evlilik de herhangi bir organizma misali beslenmek, ilgi ve sevgiyle büyütülmek ister. Çalışan bir anne, programlı ve organize yaşam tarzı içinde evliliğine de yatırım yapmanın yollarını bulacaktır.
<br><br>
Çalışan annelerin bazı şeylerden feragat etmesinde fayda var. Kıyafetlerin jilet gibi ütülü olması arzu edilen bir şeydir ama en azından bir süre nevresimleri ütülemeseniz de olur. Yani ev işlerinde eski alışkanlıklarından bir kısmını terk etmeniz gerekecek. Bu noktada, ev işlerinin eşler arasında adilane paylaşımı önemli. Bunu da birbirini kırmadan yapmanın yolu, iyi bir işbölümü yapmaktan geçiyor. Kimin hangi işten sorumlu olacağı birlikte kararlaştırılmalı ve centilmenlik anlaşmasını kimse ihlal etmemeli!
<br><br>
Feragat edilmesi gereken bir diğer büyük alışkanlık ise mükemmeliyetçilik!  Kusursuz yemekler yapamayabilirsiniz. Akşam yemeğinde masayı birbirinden leziz ve çeşitli yemeklerle donatamayabilirsiniz. Ev biraz dağılabilir. Misafirlerinize mahcup olabilirsiniz. Mükemmeli bu konularda aramamalısınız. Asıl mükemmel olan şey, sizin bir anne olmanız ve İlahî bir emanet olan yavrularınızın olması. Mükemmeliyetçi değil, affedici olun… Öncelikle de kendinizi affedin… Affetmek çok iyi gelecek size…
<br><br>
Bırakın yılları, günler geçtikçe, çocuğunuzun eskiyen hallerini özlediğinizi fark edeceksiniz. Öyleyse, önemli olan onunla geçirdiğiniz zamanın mahiyeti ve niteliği.
<br><br>
Titizlik takıntısından da kurtulmak gerek. Ülkemizde hala pek çok salon “misafir odası” olarak ayrılmakta ve koltuk takımlarının üzeri örtülerle kapatılmakta. Misafire bir “görüntü” sunmak yerine her ânı yaşama dâhil etmeyi seçmek gerek. Koltuk takımlarınız ilk günkü gibi gıcır gıcır olsa bile, önünde sonunda, modası geçecek! Üzerindeki lekelerde ise anılarınız yaşayacak.
<br><br>
Yetersizlik duygusuyla baş edebilmek için çalışan anneler biraz da kendilerini şımartabilirler. Çalışan anne olmak zordur ama herkes çalışan bir anneyi parmağı ile gösterir. Çalışan bir anne, çocuğu için de iyi bir rol modeldir aynı zamanda. İş disiplini ve ahlâkı ile rol modeldir her şeyden evvel. Çalışan bir annenin çocuğu bilir ki, annesi çalışkandır ve sorumluluk sahibidir.
<br><br>
Çalışan bir anne esnek ve spontandır. Öyle uzun uzun düşünmeye vakti yoktur ve bundan dolayı, pratiktir. Anlık çözümler üretebilir. Katı tutumları yoktur, kolay uyum sağlar. Bu esneklik ve uyum kabiliyeti, çalışan annenin örgütleme becerilerini de geliştirir.
<br><br>
Sonuç olarak, her güçlükle birlikte bir kolaylık vardır. Bize güç gelen şeyler aslında biz farkına bile varmadan bizi güçlendirir. Çalışan bir anne olmayı, yaşamı tek bir ânda hissedebilme fırsatına dönüştürün. Çalışan anneler aslında, sadece iş ile ev arasında bir denge kurmuyor, hayatın her alanını ve ânını bir dengeye oturtuyor.  Bu açıdan düşünüldüğünde, çalışan anneler yaşadıkları güçlüklere rağmen, ruhsal bakımdan bir bütünlük hissine oldukça yakınlar. Yeter ki bunun farkında olsunlar…
<br><br>
Önemli Hatırlatma: Bu içerik ilgili uzman danışman tarafından izleyicilerimizi bilgilendirme amaçlı hazırlanmıştır. Kendinizin veya çocuğunuzun sağlığı ile ilgili her konuda, bir tıp doktoruna veya çocuk eğitimi ve psikolojisi alanında çalışan uzmanlara danışmanızı tavsiye ederiz.</p></div>
</div>
</div>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js' type='text/javascript'></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){$('.gs_active .gs_card_body').slideDown();$('.gs_card_header').click(function(){var cbody=$(this).parent().find('.gs_card_body');if(cbody.css('display')=='block'){cbody.slideUp();$(this).parent().removeClass('gs_active');}
else{$('.gs_list_box_container .gs_card').removeClass('gs_active');$(this).parent().addClass('gs_active');$('.gs_card_body').slideUp();cbody.slideDown();}});});
//]]>
</script>
</body>
</html>