
<!--
Kedves Attila!

Köszönöm a tegnapi telefonos egyeztetést, küldjük a részleteket.

I. Árajánlat:
PDF-formátumban csatoljuk az árajánlatunkat.

A sablon oldal azt jelenti, hogy az oldalt egy előre elkészített vázra építjük fel. Ennek 63 dollár + áfa díja van, és ehhez jön hozzá a munkadíjunk.

    Előnyök: a programozás és a grafikai tervezés egy részét meg lehet "spórolni", így gyorsabb, és olcsóbb az elkészülése.
    Hátrányok: egy kicsit lassabb lehet az egyedi programozású oldalhoz képest.

(Készítünk egyedi kódolású oldalakat is, amelyek egy kicsit gyorsabbak, de annak az elkészítési ideje és díja kb. a duplája ennek.)

A sablonoknál a színeket, szövegeket, képeket, menüpontokat, betűtípust lehet módosítani. Az oldalakat tudjuk bővíteni további elemekkel. Tehát lényegében teljesen egyedi felépítést tudunk kialakítani.

Néhány javasolt mintát küldünk:
https://avada.theme-fusion.com/electrician/
https://avada.theme-fusion.com/mechanic/
https://avada.theme-fusion.com/plumber/

A fenti minták nem feltétlenül kapcsolódnak a tevékenységéhez, de a képek, menüpontok cseréjével ez könnyen átalakítható.

Itt találhatóak további minták: https://avada.theme-fusion.com/demos/
Fontos, hogy a sablont Ön vegye meg, mert így az Öné lesz a licence tulajdonjoga. (Az ügyintézésben segítünk.)

Az oldal mellé adunk ajándékba 20 db jó minőségű fotót is, ezeket fel tudjuk használni illusztrációként.
A saját fotók persze mindig hitelesebbek, ezek inkább csak illusztráció gyanánt, háttérképnek használhatóak.


II. Tárhely és domain:

Szükség lesz egy domain névre, és egy tárhelyre, ahová a fájlok felkerülnek.

A Mediacentert ajánljuk a szolgáltatók közül:
https://www.mediacenter.hu/
Mi is náluk vagyunk. (Jutalékot nem kapunk tőlük, nem ezért ajánljuk őket.)

Ha csak 1 honlap kerül elhelyezésre, akkor elegendő az ECO tárhely csomag. (10.000 Ft + áfa / év). A szolgáltatónak szükséges évente kifizetni ezt a díjat.

A megrendelés folyamatában szívesen segítünk. A személyes / céges adatokat fogják kérni, utána kártyával tudja kifizetni a megrendelést.
Az fontos, hogy a tárhely és a domain is az Ön nevén legyen, mert az Ön tulajdona lesz.

A tárhelyen szerintem nem érdemes spórolni. Vannak ugyan ennél olcsóbb szolgáltatók, de ott általában valami "kimarad". Pl. a biztonságra kevésbé adnak, vagy nincs napi adatmentés.
A Mediacenternél a robot támadások nagy részét szűrik, és csak az fér hozzá a fájlokhoz, aki előtte az ügyfélkapura belépett. Naponta készül mentés a weboldalról, ha bármi történne, ezeket az ügyfélkapuról el tudjuk érni. Továbbá, ingyenes SSL-tanúsítványt biztosítanak az oldalakhoz, ez is javítja az oldal biztonsági állapotát, és a Google jobban megbízik az ilyen oldalakban.
Sok szolgáltatónál alacsonyabb az éves díj, de az SSL-ért külön kell évi 4-7 ezer Ft-ot fizetni.


III. Keresőoptimalizálás:

Az alapszintű keresőoptimalizálási beállításokat elvégezzük, ez azonban nem fog automatikusan jó pozíciókkal társulni.

A jó pozíciókhoz az alábbiakra van szükség:
1. Technikailag rendben lévő oldalra.
2. Sok, egyedileg megírt szövegre.
3. Jó minőségű, erős weboldalakról az Ön oldalára mutató, kattintható linkekre. (Linképítésre van szükség – ez fizetős szolgáltatás, mi nem foglalkozunk ezzel.)
4. Időre, amíg beérik a folyamat.

Az utóbbi évek tapasztalatai azt mutatják, hogy a Google arra törekszik, hogy egyre kevésbé lehessen egy oldalt fixen jó pozíciókban tartani.
A pozíció függ az internetező elhelyezkedésétől (általában a keresés helyéhez közeli cégeket ajánl), valamint az aktuális algoritmustól, amelyet viszont folyamatosan módosítanak.
A régi, megbízható, sok tartalommal rendelkező oldalak iránt a Google nagyobb bizalommal van.

Rendszeresen frissülő blog nélkül nehéz a keresőben jó pozícióba kerülni, elsősorban azok szerepelnek előrébb a keresőben, akik minden fontos témában írtak egyedi szövegezésű blogbejegyzéseket, és más weboldalakról is vásároltak linkeket.

A keresőből érkező forgalomra inkább másodlagos látogatószerző eszközként érdemes tekinteni, és mellette javasolt hirdetési kampányokat is futtatni.


IV. Mindig az a kérdés, hogy: honnan jön látogató az oldalra?

Ha gyorsabb látogatószerzésre van szükség, akkor a Google Ads hirdetési rendszerét érdemes használni, így lehet látogatókat vinni a weboldalra.

A Google-ben meghatározott szavakra lehet hirdetést megjeleníteni, pl. "tűzvédelem Budapest", "tűzvédelem Pest megye" kifejezésre lehet hirdetést feladni, és kattintásonként kell fizetni. Az ár változó, témafüggő, és az is befolyásolja, hogy mennyien hirdetnek, de jellemzően 400-1200 Ft / kattintás díjjal működik.

Mi ilyen kampányokkal nem foglalkozunk, mert ez egy külön szakterület, de a Google-kampányokra tudunk kivitelezőt ajánlani.


V. Javasolt menüpontok, felépítés:

Egy pár ötletet írok.

    Főoldal (Itt minden fontosabb menüpontot megjelenítenék egy rövid bevezetővel, továbbkattintási lehetőséggel. A fontosabb részleteket az oldal tetején szerepeltetni kell: milyen szolgáltatásokat kínál, hány év tapasztalata van, mi az az extra, amiben többet ad, mint mások stb.)
    Bemutatkozás (Ide tennék fel egy szakmai bemutatkozást, fotóval együtt. A fotó bizalmat sugároz, ez interneten különösen fontos, mert a személyes találkozáshoz képest sokkal nehezebb bizalmat építeni. Itt szintén leírnám, hogy milyen tapasztalata van, milyen irányelveket követ, mi a hitvallása stb.)
    Tevékenységek (Itt felsorolnám a szolgáltatásokat, és mindegyikhez írnék egy bő leírást. A szolgáltatások alatt érdemes kialakítani egy Gyakori kérdések blokkot, ahol fel lehet sorolni azokat a kérdéseket, amelyeket a legtöbbször feltesznek az érdeklődők e-mailben, telefonon. 
    Árak (Ez nehéz kérdés, van aki kirak árlistát az egyszerűbb szolgáltatásokra, más mindig egyedi díjat kalkulál.)
    Vélemények (Felkerülhetnek korábbi szöveges ajánlások. A szöveges ajánlásokat van, aki teljes névvel is vállalja, van aki csak monogrammal, vagy keresztnévvel, ez is bizalmat sugároz.)
    Kapcsolat (Fontosabb kapcsolati adatokat érdemes jól láthatóan feltünteteni, tehát székhely, telefonszám, e-mail cím, FB oldal, stb. És egy kapcsolati űrlap is hasznos, ahol azonnal tudnak írni Önnek, amelyet e-mailként kap meg.)


VI. Adatvédelem
Az oldalon szükség lesz adatvédelmi nyilatkozatra is, ez a GDPR miatt kötelező. A nyilatkozat alapvetően jogi szöveg, jogászt tudunk ajánlani.
De vannak, akik más mintákat írnak át, vagy alakítanak át.
Az űrlapot úgy állítjuk be, hogy az érdeklődő csak az adatvédelem elfogadása után tudja elküldeni az üzenetét.
Illetve, a cookiek használatára figyelmeztető sávot is kialakítunk, erre is a GDPR miatt van szükség.


Igyekeztem mindent összeszedni.

Kérem, ha bármilyen kérdése van, keressen minket bizalommal. :)

Köszönöm, és várom szíves visszajelzését!

Barna

-->


<!doctype html>
<html lang="hu">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="/docs/4.0/assets/img/favicons/favicon.ico">

    <title>Árajánlat kalkulátor</title>

    <link rel="canonical" href="https://getbootstrap.com/docs/4.0/examples/checkout/">

    <!-- Bootstrap core CSS -->
    <link href="build/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="custom.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="form-validation.css" rel="stylesheet">
  </head>

  <body>

    <div class="container-fluid">
	<!--
      <div class="py-5 text-center">
        <img class="d-block mx-auto mb-4" src="https://getbootstrap.com/docs/4.0/assets/brand/bootstrap-solid.svg" alt="" width="72" height="72">
        <h2>Checkout form</h2>
        <p class="lead">Below is an example form built entirely with Bootstrap's form controls. Each required form group has a validation state that can be triggered by attempting to submit the form without completing it.</p>
      </div>
	  -->
	  
	  <!--
      <div class="py-5 text-center">
        <h2>Árajánlat kalkulátor</h2>
      </div>
	  -->

      <div class="row row-eq-height">
	  
        <div class="col-md-8 order-md-2 mb-4 col-right">

<div class="text-wrap">
	  <div id="div1"></div>
</div>


		  <!--
          <h4 class="d-flex justify-content-between align-items-center mb-3">
            <span class="text-muted">Your cart</span>
            <span class="badge badge-secondary badge-pill">3</span>
          </h4>
          <ul class="list-group mb-3">
            <li class="list-group-item d-flex justify-content-between lh-condensed">
              <div>
                <h6 class="my-0">Product name</h6>
                <small class="text-muted">Brief description</small>
              </div>
              <span class="text-muted">$12</span>
            </li>
            <li class="list-group-item d-flex justify-content-between lh-condensed">
              <div>
                <h6 class="my-0">Second product</h6>
                <small class="text-muted">Brief description</small>
              </div>
              <span class="text-muted">$8</span>
            </li>
            <li class="list-group-item d-flex justify-content-between lh-condensed">
              <div>
                <h6 class="my-0">Third item</h6>
                <small class="text-muted">Brief description</small>
              </div>
              <span class="text-muted">$5</span>
            </li>
            <li class="list-group-item d-flex justify-content-between bg-light">
              <div class="text-success">
                <h6 class="my-0">Promo code</h6>
                <small>EXAMPLECODE</small>
              </div>
              <span class="text-success">-$5</span>
            </li>
            <li class="list-group-item d-flex justify-content-between">
              <span>Total (USD)</span>
              <strong>$20</strong>
            </li>
          </ul>

          <form class="card p-2">
            <div class="input-group">
              <input type="text" class="form-control" placeholder="Promo code">
              <div class="input-group-append">
                <button type="submit" class="btn btn-secondary">Redeem</button>
              </div>
            </div>
          </form>
		  -->
        </div>
		
		
        <div class="col-md-4 order-md-1 col-left">
          <h4 class="mb-3">Név (megszólítás)</h4>
          <form class="needs-validation" method="post" action="https://jelenaweben.hu/a/" novalidate>
            <div class="row">
              <div class="col-md-12 mb-3">
                <input name="nev" type="text" class="form-control" id="fNev" placeholder="" value="" required>
                <div class="invalid-feedback">
                  Kötelező
                </div>
              </div>
            </div>

            <h4 class="mb-3">Magázódunk, vagy tegeződünk?</h4>
            <div class="d-block my-3">
              <div class="custom-control custom-radio">
                <input id="mod1" name="mod" type="radio" value="0" class="custom-control-input" required>
                <label class="custom-control-label" for="mod1">Magázódás</label>
              </div>
              <div class="custom-control custom-radio">
                <input id="mod2" name="mod" type="radio" value="1" class="custom-control-input" required>
                <label class="custom-control-label" for="mod2">Tegeződés</label>
              </div>
            </div>
			
            <div class="row">
              <div class="col-md-12 mb-3">
				<h4 class="mb-3">Választott sablonok (3-5 db, egymás alá, új sorban)</h4>
                <textarea rows="4" name="sablon" class="form-control" id="fSablon" placeholder="" required></textarea>
                <div class="invalid-feedback">
                  Kötelező
                </div>
              </div>
            </div>

            <h4 class="mb-3">Van már tárhelye?</h4>

            <div class="d-block my-3">
              <div class="custom-control custom-radio">
                <input id="tarhely1" name="tarhely" type="radio" value="0" class="custom-control-input" required>
                <label class="custom-control-label" for="tarhely1">Nincs</label>
              </div>
              <div class="custom-control custom-radio">
                <input id="tarhely2" name="tarhely" type="radio" value="1" class="custom-control-input" required>
                <label class="custom-control-label" for="tarhely2">Van</label>
              </div>
            </div>

            <h4 class="mb-3">Keresőoptimalizálás fontos neki?</h4>

            <div class="d-block my-3">
              <div class="custom-control custom-radio">
                <input id="seo1" name="seo" type="radio" value="1" class="custom-control-input" required>
                <label class="custom-control-label" for="seo1">Igen</label>
              </div>
              <div class="custom-control custom-radio">
                <input id="seo2" name="seo" type="radio" value="0" class="custom-control-input" required>
                <label class="custom-control-label" for="seo2">Nem</label>
              </div>
            </div>

            <h4 class="mb-3">Google Ads hirdetési lehetőség érdekli?</h4>

            <div class="d-block my-3">
              <div class="custom-control custom-radio">
                <input id="ads1" name="ads" type="radio" value="1" class="custom-control-input" required>
                <label class="custom-control-label" for="ads1">Igen</label>
              </div>
              <div class="custom-control custom-radio">
                <input id="ads2" name="ads" type="radio" value="0" class="custom-control-input" required>
                <label class="custom-control-label" for="ads2">Nem</label>
              </div>
            </div>

            <h4 class="mb-3">Facebook hirdetési lehetőség érdekli?</h4>

            <div class="d-block my-3">
              <div class="custom-control custom-radio">
                <input id="fb1" name="fb" type="radio" value="1" class="custom-control-input" required>
                <label class="custom-control-label" for="fb1">Igen</label>
              </div>
              <div class="custom-control custom-radio">
                <input id="fb2" name="fb" type="radio" value="0" class="custom-control-input" required>
                <label class="custom-control-label" for="fb2">Nem</label>
              </div>
            </div>

            <h4 class="mb-3">Javasolt felépítést küldünk neki?</h4>

            <div class="d-block my-3">
				<!--
				<label class="switch">
				  <input type="checkbox">
				  <span class="slider round" data-toggle="collapse" data-target="#structure"></span>
				</label>

				<div id="structure" class="collapse">
				-->

										
					<div class="form-check">

					  <input class="form-check-input" name="struktura[]" type="checkbox" value="fooldal" id="defaultCheck1">
					  <label class="form-check-label" for="defaultCheck1">
						Főoldal
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="bemutatkozas" id="defaultCheck11">
					  <label class="form-check-label" for="defaultCheck11">
						Személyes bemutatkozás
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="bemutatkozas_ceges" id="defaultCheck13">
					  <label class="form-check-label" for="defaultCheck13">
						Céges bemutatkozás
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="szolgaltatasok" id="defaultCheck12">
					  <label class="form-check-label" for="defaultCheck12">
						Szolgáltatások
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="termekek" id="defaultCheck9">
					  <label class="form-check-label" for="defaultCheck9">
						Termékek
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="galeria" id="defaultCheck2">
					  <label class="form-check-label" for="defaultCheck2">
						Galéria
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="velemenyek" id="defaultCheck3">
					  <label class="form-check-label" for="defaultCheck3">
						Vélemények
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="gyik" id="defaultCheck4">
					  <label class="form-check-label" for="defaultCheck4">
						Gyakori kérdések
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="referenciak" id="defaultCheck6">
					  <label class="form-check-label" for="defaultCheck6">
						Referenciák
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="partnerek" id="defaultCheck7">
					  <label class="form-check-label" for="defaultCheck7">
						Partnerek
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="arak" id="defaultCheck8">
					  <label class="form-check-label" for="defaultCheck8">
						Árak
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="blog" id="defaultCheck10">
					  <label class="form-check-label" for="defaultCheck10">
						Blog
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="hirek" id="defaultCheck14">
					  <label class="form-check-label" for="defaultCheck14">
						Hírek
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="esemenyek" id="defaultCheck17">
					  <label class="form-check-label" for="defaultCheck17">
						Események
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="dokumentumok" id="defaultCheck18">
					  <label class="form-check-label" for="defaultCheck18">
						Dokumentumok
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="telepules" id="defaultCheck16">
					  <label class="form-check-label" for="defaultCheck16">
						Település lista
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="foglalas" id="defaultCheck15">
					  <label class="form-check-label" for="defaultCheck15">
						Foglalási rendszer (kivéve szállás!)
					  </label>
					</div>
					
					<div class="form-check">
					  <input class="form-check-input" name="struktura[]" type="checkbox" value="kapcsolat" id="defaultCheck5">
					  <label class="form-check-label" for="defaultCheck5">
						Kapcsolat
					  </label>
					</div>

				<!--</div>-->
            </div>


            <hr class="mb-4">
            <button class="btn btn-primary btn-lg btn-block" type="submit">KÉSZ!</button>
          </form>
        </div>
      </div>

      <!--<footer class="my-5 pt-5 text-muted text-center text-small">
        <p class="mb-1">&copy; 2017-2018 Company Name</p>
        <ul class="list-inline">
          <li class="list-inline-item"><a href="#">Privacy</a></li>
          <li class="list-inline-item"><a href="#">Terms</a></li>
          <li class="list-inline-item"><a href="#">Support</a></li>
        </ul>
      </footer>
	  -->
    </div>

    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script>window.jQuery || document.write('<script src="build/assets/js/vendor/jquery-slim.min.js"><\/script>')</script>
    <script src="build/assets/js/vendor/popper.min.js"></script>
    <script src="build/dist/js/bootstrap.min.js"></script>
    <script src="build/assets/js/vendor/holder.min.js"></script>
	<script>
      // Example starter JavaScript for disabling form submissions if there are invalid fields
      (function() {
        'use strict';

        window.addEventListener('load', function() {
          // Fetch all the forms we want to apply custom Bootstrap validation styles to
          var forms = document.getElementsByClassName('needs-validation');

          // Loop over them and prevent submission
          var validation = Array.prototype.filter.call(forms, function(form) {
            form.addEventListener('submit', function(event) {
              if (form.checkValidity() === false) {
                event.preventDefault();
                event.stopPropagation();
              }
              form.classList.add('was-validated');
            }, false);
          });
        }, false);
      })();
	  
	  
function CopyToClipboard(containerid) {
  if (document.selection) {
    var range = document.body.createTextRange();
    range.moveToElementText(document.getElementById(containerid));
    range.select().createTextRange();
    document.execCommand("copy");
  } else if (window.getSelection) {
    var range = document.createRange();
    range.selectNode(document.getElementById(containerid));
    window.getSelection().addRange(range);
    document.execCommand("copy");
    alert("Árajánlat kimásolva. 😎 Illeszd be a levélbe. 🍹")
  }
}
    </script>
  </body>
</html>