Propojení populární služby Zadarma s 1C je nyní otázkou pár minut. Stačí připojit hotové rozšíření pro integraci 1C a Zadarmy. Instalaci může snadno provést každý zaměstnanec, dokonce i uklízečka, teta Masha, specialista na úklid.

Nejprve jsme se zaměřili na malé podniky, které aktivně využívají ústřednu Zadarma a konfiguraci 1C: Řízení malé firmy 1.6.

Jak to bylo předtím

Pro integraci se Zadarmou jste museli použít speciální dialer zabudovaný do 1C - takzvané SIP pozadí. Tato možnost byla vhodná pro několik „kdyby“:

• pokud je 1C nainstalován na místním počítači, a ne někde na terminálovém serveru
• pokud uživatel souhlasí s tím, že místo stolního telefonu bude používat 1C dialer

Obecně platí, že pokud všechna „kdyby“ souhlasila, byla integrace možná.

Jak se to stalo teď

Nyní pro integraci 1C a Zadarmy vůbec nezáleží na tom, které koncové zařízení se používá pro hovory. Může to být cokoli:

• stolní telefon
• softphone nainstalovaný v OS
• webové pozadí běžící v prohlížeči

Rozšíření 1C pro Zadarma interaguje s API, nikoli s dialerem. Nezáleží tedy na tom, co přesně uživatel zavolá.

Snadná instalace

Instalace se skládá z 1 kroku. Ukážeme si jen 2 screenshoty.

Umístění na domovské stránce

Panel telefonování Zadarma se automaticky zobrazí na domovské stránce. Pokud to najednou uživatel nepotřebuje, pak může jednoduše zrušit zaškrtnutí políčka v nabídce „Zobrazit“ - „Přizpůsobit úvodní stránku“.

Snadné nastavení

Klíče API přebíráme z osobního účtu Zadarma

a vložte je do 1C

A samozřejmě zadáváme přihlašovací jméno / heslo účtu na simplyit.io.

To je vše, nyní je váš 1C připojen k Zadarmě.

Volání po kliknutí v 1C

Kdekoli vidíme ikonu „telefonu“, můžeme na ni kliknout a Zadarma začne vytáčet číslo.

Požadavky „Kontaktní informace“ jsou v mnoha seznamech dokumentů, referenčních knih - pro volání již nemusíte běžet na klientovu kartu. Můžete například volat přímo ze seznamu objednávek, faktur, spotřebního materiálu

Klientská karta pro příchozí hovor

Funkce, která se ve skutečnosti stala standardní a povinnou při integraci 1C a PBX. I když je třeba poznamenat, že není vždy žádaná, takže ji lze vypnout v nastavení panelu Telefonie.

Registrace hovoru pomocí dokumentu události

Stejně tak můžete ovládat potřebu automatického vytváření dokumentu „Událostní telefonní hovor“. Pomocí tohoto dokumentu je vhodné zanechat komentáře k hovoru.

A co je nejdůležitější, na základě tohoto dokumentu pak můžete zadat Objednávku, Fakturu a tím bude jasně viditelný vztah mezi výzvou a prodejem.

K dokumentu Telefonní hovor můžete připojit připomenutí, což je velmi výhodné, pokud zaměstnanec slíbil, že zavolá klientovi později.

Historie volání PBX

Historie hovorů je samozřejmě velmi důležitá věc. Rozšíření pro integraci 1C a Zadarmy nabízí několik možností pro práci s historií.

Například uživatel chce zobrazit příběh sám. Podobně jako v seznamu posledních hovorů v našem mobilním telefonu. Tuto historii lze zobrazit otevřením karty Historie na domovské stránce.

Velmi často chci vidět historii konkrétního klienta, kontaktní osoba nebo fyzická osoba. V případě klienta potřebujeme vidět jak volání na čísla samotné protistrany, tak na čísla všech jeho kontaktních osob.

Historii hovorů s výběrem klientem lze zobrazit přímo na jeho kartě. Historie zahrnuje hovory od klienta a všech jeho kontaktů. Pokud číslo náleží samotné protistraně, pole „Kontakt“ není vyplněno.

Od autora: V tomto kurzu vás provedeme jednoduchou technikou pro vytvoření obrázku na pozadí, který se plně roztáhne po celé šířce výřezu prohlížeče. K tomu potřebujeme vlastnost CSS velikosti pozadí; JavaScript není potřeba.

Příklady responzivních celých obrázků na pozadí

V dnešní době je velmi populární používat jako pozadí obrovskou fotografii, která zabírá celou webovou stránku. Zde jsou příklady několika webů, které mají nastaveny responzivní obrázky na pozadí:

Pokud byste chtěli dosáhnout podobného výsledku ve svém dalším webovém projektu, pak tento článek potřebujete.

Základní principy

Zde je náš akční plán.

Pomocí vlastnosti background-size zcela vyplňte výřez

Vlastnost CSS velikosti pozadí je nastavena na pokrytí. Hodnota obalu říká prohlížeči, aby automaticky a proporcionálně změnil šířku a výšku obrázku na pozadí tak, aby byla vždy stejná nebo větší než šířka / výška výřezu.

Ke zpracování malých obrázků na pozadí pro mobilní zařízení použijte mediální dotaz

Abychom zvýšili rychlost načítání stránky na malých obrazovkách, použijeme mediální dotaz ke zpracování menší verze našeho obrázku na pozadí. Není to povinné. Tato technika bude fungovat i bez ní. Proč je ale dobré použít malý obrázek na pozadí pro mobilní zařízení?

Obrázek, který jsem použil v ukázce, je 5500x3600px. Toto rozlišení je dostačující pro většinu širokoúhlých počítačových monitorů, které jsou v současné době na trhu. K tomu však musíte zpracovat soubor o velikosti 1,7 MB.

Tak obrovská dodatečná zátěž jen kvůli umístění fotografie na pozadí stejně neprospěje. A samozřejmě to bude extrémně špatné pro připojení pomocí mobilního internetu. A také takové rozlišení je u zařízení s malou obrazovkou zbytečné (o tom později). Pojďme se podívat na celý proces.

Html

Pro označení potřebujete pouze toto:

Prvku těla přiřadíme obrázek na pozadí, aby obrázek vždy vyplnil celý výřez prohlížeče.

Tato technika však bude fungovat i pro jakýkoli prvek na úrovni bloku (jako div nebo formulář). Pokud je šířka a výška prvku vašeho bloku plynulá, obrázek na pozadí bude vždy zmenšen tak, aby zaplnil celý kontejner.

CSS

Pro element body nastavíme následující styly:

body ( / * Path to image * / background-image: url (images / background-photo.jpg); / * Image background is always center vertically and horizontally * / background-position: center center; / * Background background is not repeat * / opakování na pozadí: neopakování; / * obrázek na pozadí je ve výřezu pevný, takže se neposune, když je výška obsahu větší než výška obrázku * / pozadí-příloha: pevné; / * To umožňuje obrázek na pozadí pro přizpůsobení velikosti kontejneru * / background-size: cover; / * Nastaví barvu pozadí, která se má zobrazit při načítání obrázku na pozadí * / background-color: # 464646;)

Nejdůležitější pár vlastností / hodnot, na který si dát pozor:

velikost pozadí: obal;

Tady kouzlo začíná. Tato dvojice vlastností / hodnot říká prohlížeči, aby proporcionálně upravil obrázek na pozadí, tj. tak, aby jeho šířka a výška byly stejné nebo větší než šířka / výška prvku (v našem případě je to prvek těla).

Tato dvojice vlastností a hodnot má však jeden problém: pokud je obrázek na pozadí menší než prvek těla - což se děje na obrazovkách s vysokým rozlišením a / nebo když máte na stránce obrovské množství obsahu - prohlížeč se nevyhnutelně přiblíží na obrázku. A jak víme, když zvětšíme velikost bitmapy, kvalita obrazu se sníží (jinými slovy dochází k pixelaci).

Zvýšení velikosti obrázku z původní velikosti ovlivní kvalitu obrazu. Při výběru vhodného obrázku na to pamatujte. Demo používá obrovskou fotografii 5500x3600px pro širokoúhlé monitory, takže bude vyžadovat velmi velkou obrazovku, aby došlo ke kvalitnímu zkreslení. Pokračujme. Aby byl obrázek na pozadí ve středu výřezu, přidáme:

poloha pozadí: střed středu;

Tento záznam umístí pozadí na souřadnicovou osu do středu výřezu. Dále musíme definovat, co se stane, když výška obsahu překročí viditelnou výšku výřezu. Když k tomu dojde, zobrazí se posuvník.

V tomto případě se musíme ujistit, že obrázek na pozadí zůstane na svém původním místě, i když uživatel posouvá stránku dolů. V této situaci obrázek buď skončí při posouvání, nebo se bude při posouvání pohybovat (což může být pro uživatele velmi rušivé). Chcete-li opravit pozadí, nastavíme vlastnost background-attachment na fixed.

připojení na pozadí: pevné;

V ukázce jsem přidal funkci „načíst obsah“, abyste viděli, co se stane, když se v prohlížeči zobrazí posuvník, když je vlastnost pozadí-přílohy nastavena na pevnou. Můžete si také stáhnout ukázku a hrát si s hodnotami vlastností polohování (například s připojením na pozadí a pozicí na pozadí) a zjistit, jak to ovlivňuje posouvání stránky a obrázek na pozadí. Zbytek hodnot vlastností je docela samozřejmý.

Zkratka CSS

Podrobně jsem popsal vlastnosti pozadí, abych je snáze vysvětlil. Zkrácený zápis bude také ekvivalentní:

body (background: url (background-photo.jpg) center center cover no-repeat fixed;)

Vše, co musíte udělat, je změnit hodnotu adresy URL tak, aby ukazovala na cestu k obrázku na pozadí.

Volitelné: mediální dotaz pro malé obrazovky

U malých obrazovek jsem pomocí Photoshopu zmenšil původní obrázek na pozadí proporcionálně na 768x505px a také jsem použil Smush.it pro zmenšení velikosti o něco dále. Tím se zmenšila velikost souboru z 1741 kB na 114 kB. Tito. velikost obrázku zmenšena o 93%.

Nenechte se prosím zmýlit, 114KB je na čistě estetický designový prvek stále docela dost. Vzhledem k dodatečné režii 114 kB bych takový soubor použil pouze tehdy, kdybych viděl příležitost výrazně zlepšit uživatelské prostředí (UX). v současné době pochází značná část internetového provozu z pozadí mobilních zařízení - obrázek: url (obrázky / pozadí - fotografie - mobilní - zařízení. jpg);

Mediální dotaz má limit maximální šířky: 767 pixelů, což znamená, že pokud je výřez prohlížeče větší než 767 pixelů, načte se velký obrázek na pozadí.

Nevýhodou použití tohoto mediálního dotazu je, že pokud změníte šířku okna prohlížeče, například z 1200px na 640px (nebo naopak), okamžitě uvidíte okamžik načtení malého nebo velkého obrázku na pozadí.

Navíc díky tomu, že některá zařízení s malou obrazovkou dokážou zobrazit více pixelů - například iPhone 5 s displejem sítnice je schopen zobrazit rozlišení 1136x640px - bude malý obrázek na pozadí pixelován.

Shrnutí

Můžete si zobrazit aktuálnější verzi zdrojového kódu z tohoto kurzu na GitHubu. Mohu vás pouze upozornit na jednu věc: používejte tuto techniku ​​opatrně, protože velké soubory mohou vážně poškodit UX, zvláště pokud koncový uživatel používá pomalé a nespolehlivé připojení k internetu. To je další důvod, proč byste měli zvolit vhodnou barvu pozadí, aby si uživatel mohl přečíst obsah při načítání obrázku na pozadí.

Velká videa na pozadí webových stránek jsou velmi oblíbeným trendem ve webovém designu. Díky chytře aplikovaným videím může být web dramatičtější a poutavější pro uživatele.

Kromě toho lze pozadí videa přehrávat plynule a bez „brzd“, na rozdíl od pozadí vytvořených pomocí JavaScriptu, které vyžadují načtení určitého kódu a obrázků, než uživatel uvidí výsledek animace.

Existují společnosti jako Powerhouse nebo Adidas, které používají video jako pozadí webové stránky, aby uživateli sdělily konkrétní zprávu nebo příběh o produktu nebo službě.

Ačkoli nejpopulárnějším způsobem, jak vytvořit pozadí videa, je použití HTML5 video tag spolu s některými parametry CSS, měli byste také věnovat pozornost alternativním zdrojům videa, například YouTube. V takovém případě si nemusíte dělat starosti s pomalou odezvou serveru, protože požadavek bude odeslán přímo na YouTube.

V tomto článku vám ukážu, jak můžete vytvořit skvělý web, který jako pozadí používá videa z YouTube. K úpravě a ovládání vzhledu našeho videa použijeme jQuery.mb.YTPlayer.js. Začněme tedy!

Stáhněte si zdroje
Demo

Budete potřebovat:

// Velký obsah na pozadí zde

Nyní musíte vyplnit každou sekci obsahem. V sekci s velkým a malým pozadím umístěte třídu vzor, pro vytvoření lehké textury v našem videu. Musíte také přidat h1, h2, odstavec a tlačítko.