Pripojenie obľúbenej služby Zadarma k 1C je teraz otázkou niekoľkých minút. Stačí pripojiť hotové rozšírenie na integráciu 1C a Zadarmy. Inštaláciu môže ľahko vykonať každý zamestnanec, dokonca aj upratovačka, teta Masha, špecialista na čistenie.

V prvom rade sme sa zamerali na malé podniky, ktoré aktívne používajú ústredňu Zadarma a konfiguráciu 1C: Manažment malej firmy 1.6.

Ako to bolo predtým

Na integráciu so Zadarmou ste museli použiť špeciálny dialer zabudovaný do 1C - takzvané SIP pozadie. Táto možnosť bola vhodná pre niekoľko „if“:

• ak je 1C nainštalovaný na lokálnom počítači, a nie niekde na terminálovom serveri
• ak používateľ súhlasí s tým, že namiesto stolného telefónu použije dialer 1C

Integrácia bola vo všeobecnosti možná, ak súhlasili všetky „keby“.

Ako sa to stalo teraz

Teraz pre integráciu 1C a Zadarmy vôbec nezáleží na tom, ktoré koncové zariadenie sa používa na hovory. Môže to byť čokoľvek:

• stolný telefón
• softvérový telefón nainštalovaný v OS
• webové pozadie spustené v prehliadači

Rozšírenie 1C pre Zadarma interaguje s API, nie s dialerom. Preto nezáleží na tom, čo presne používateľ zavolá.

Jednoduchá inštalácia

Inštalácia pozostáva z 1 kroku. Ukážeme si len 2 snímky obrazovky.

Umiestnenie na domovskej stránke

Telefónny panel Zadarma sa automaticky zobrazí na domovskej stránke. Ak to používateľ zrazu nepotrebuje, môže jednoducho zrušiť začiarknutie políčka v ponuke „Zobraziť“ - „Prispôsobiť úvodnú stránku“.

Jednoduché nastavenie

Kľúče API preberáme z osobného účtu Zadarma

a vložte ich do 1C

A samozrejme zadáme prihlasovacie meno / heslo k účtu na simplit.io.

To je všetko, teraz je váš 1C prepojený so Zadarmou.

Hovory na kliknutie v 1C

Kdekoľvek vidíme ikonu „telefónu“, môžeme na ňu kliknúť a Zadarma začne vytáčať číslo.

Náležitosti „Kontaktné informácie“ sú v mnohých zoznamoch dokumentov, referenčných knihách - na uskutočnenie hovoru už nepotrebujete bežať na kartu klienta. Volať môžete napríklad priamo zo zoznamu objednávok, faktúr, spotrebného materiálu

Karta klienta pre prichádzajúci hovor

Funkcia, ktorá sa v skutočnosti stala štandardnou a povinnou pri integrácii 1C a PBX. Aj keď je potrebné poznamenať, že nie je vždy žiadaný, takže je možné ho vypnúť v nastaveniach panelu Telefónia.

Registrácia hovoru s dokumentom udalosti

Rovnako tak môžete ovládať potrebu automatického vytvárania dokumentu „Udalosť-telefonický hovor“. Pomocou tohto dokumentu je vhodné zanechať komentár k hovoru.

A čo je najdôležitejšie, na základe tohto dokumentu potom môžete zadať Objednávku, Faktúru a tým bude vzťah medzi výzvou a predajom dobre viditeľný.

K dokumentu Telefónny hovor môžete pripojiť pripomienku, čo je veľmi výhodné, ak zamestnanec sľúbil, že klientovi zavolá neskôr.

História hovorov PBX

História hovorov je samozrejme veľmi dôležitá vec. Rozšírenie pre integráciu 1C a Zadarmy ponúka niekoľko možností práce s históriou.

Užívateľ si napríklad chce pozrieť príbeh sám. Podobne ako zoznam posledných hovorov v našom mobilnom telefóne. Túto históriu je možné zobraziť otvorením karty História na domovskej stránke.

Veľmi často chcem vidieť históriu konkrétneho klienta, kontaktná osoba alebo fyzická osoba. V prípade klienta musíme vidieť obidva hovory na čísla samotnej protistrany a na čísla všetkých jeho kontaktných osôb.

Históriu hovorov s výberom klientom je možné prezerať priamo na jeho karte. História obsahuje hovory od klienta a všetky jeho kontakty. Keď číslo patrí protistrane, pole „Kontakt“ sa nevyplní.

Od autora: V tomto návode vás prevedieme jednoduchou technikou na vytvorenie obrázka na pozadí, ktorý sa úplne roztiahne po celej šírke výrezu prehliadača. Na to potrebujeme vlastnosť CSS veľkosti pozadia; JavaScript nie je potrebný.

Príklady responzívnych celých obrázkov na pozadí

V dnešnej dobe je veľmi populárne používať obrovskú fotografiu ako pozadie, ktoré zaberá celú webovú stránku. Tu sú príklady niekoľkých webov, ktoré majú nastavenú responzívnu grafiku celého pozadia:

Ak by ste chceli dosiahnuť podobný výsledok vo svojom ďalšom webovom projekte, tento článok je to, čo potrebujete.

Základné princípy

Tu je náš akčný plán.

Na úplné vyplnenie výrezu použite vlastnosť veľkosti pozadia

Vlastnosť CSS veľkosti pozadia je nastavená na pokrytie. Hodnota obalu hovorí prehliadaču, aby automaticky a proporcionálne zmenil šírku a výšku obrázku na pozadí tak, aby bola vždy rovnaká alebo väčšia ako šírka / výška výrezu.

Na spracovanie malých obrázkov na pozadí pre mobilné zariadenia použite mediálny dotaz

Na zvýšenie rýchlosti načítania stránky na malých obrazovkách použijeme na spracovanie menšej verzie nášho obrázka na pozadí mediálny dopyt. Nie je to povinné. Táto technika bude fungovať aj bez nej. Prečo je však dobré použiť malý obrázok na pozadí pre mobilné zariadenia?

Obrázok, ktorý som použil v ukážke, má 5500 x 3600 pixelov. Toto rozlíšenie je dostatočné pre väčšinu širokouhlých počítačových monitorov, ktoré sú v súčasnosti na trhu. Na to však musíte spracovať súbor 1,7 MB.

Také obrovské dodatočné zaťaženie len kvôli umiestneniu fotografie na pozadí aj tak neprospeje. A to bude, samozrejme, mimoriadne zlé pre pripojenia pomocou mobilného internetu. A tiež také rozlíšenie nie je potrebné pre zariadenia s malou obrazovkou (o tom neskôr). Pozrime sa na celý proces.

Html

Na označenie potrebujete iba toto:

Prvku tela priradíme obrázok na pozadí, aby obrázok vždy vyplnil celý výrez prehliadača.

Táto technika však bude fungovať aj pre akýkoľvek prvok na úrovni bloku (napríklad div alebo formulár). Ak je šírka a výška vášho prvku bloku plynulá, obrázok na pozadí bude vždy zmenšený tak, aby vyplnil celý kontajner.

CSS

Pre prvok tela sme nastavili nasledujúce štýly:

body ( / * Cesta k obrázku * / obrázok na pozadí: adresa URL (obrázky / pozadie-foto.jpg); / * Obrázok na pozadí je vždy zarovnaný na stred vertikálne a horizontálne * / poloha na pozadí: stred v strede; / * Obrázok na pozadí sa neopakuje * / opakovanie pozadia: neopakovanie; / * obrázok na pozadí je v zobrazovacom poli pevný, takže sa neposúva, keď je výška obsahu väčšia ako výška obrázku * / pozadie-príloha: pevné; / * Toto umožňuje obrázok na pozadí, ktorý sa má prispôsobiť veľkosti kontajnera * / background-size: cover; / * Nastaví farbu pozadia, ktorá sa má zobrazovať pri načítaní obrázku na pozadí * / background-color: # 464646;)

Najdôležitejší pár vlastností a hodnôt, na ktorý si dajte pozor:

veľkosť pozadia: obal;

Tu začína kúzlo. Tento pár vlastností a hodnôt hovorí prehliadaču, aby proporcionálne upravil obrázok na pozadí, t.j. tak, aby jeho šírka a výška boli rovnaké alebo väčšie ako šírka / výška prvku (v našom prípade ide o telesný prvok).

Táto dvojica vlastností / hodnôt má však jeden problém: ak je obrázok na pozadí menší ako prvok tela - čo sa deje na obrazovkách s vysokým rozlíšením a / alebo keď máte na stránke obrovské množstvo obsahu - prehliadač nevyhnutne priblíži na obrázku. A ako vieme, keď zvýšime veľkosť bitmapy, kvalita obrazu sa zníži (inými slovami, dochádza k pixelácii).

Zväčšenie veľkosti obrázka z pôvodnej veľkosti ovplyvňuje kvalitu obrazu. Majte to na pamäti pri výbere vhodného obrázku. Ukážka používa obrovskú fotografiu s rozmermi 5500 x 3600 pixelov na širokouhlé monitory, takže na skreslenie kvality by bola potrebná veľmi veľká obrazovka. Poďme ďalej. Aby bol obrázok na pozadí v strede výrezu, pridáme:

poloha pozadia: stred stredu;

Tento záznam umiestni pozadie na súradnicovú os v strede výrezu. Ďalej musíme definovať, čo sa stane, keď výška obsahu presiahne viditeľnú výšku výrezu. Keď sa to stane, zobrazí sa posúvač.

V takom prípade musíme zaistiť, aby obrázok na pozadí zostal na svojom pôvodnom mieste, aj keď sa používateľ posúva po stránke nadol. V tejto situácii sa obrázok buď skončí pri posúvaní, alebo sa bude pri posúvaní pohybovať (čo môže používateľa veľmi rozptyľovať). Aby sme opravili pozadie, nastavili sme vlastnosť background-attachment na pevnú.

príloha na pozadí: pevná;

V ukážke som pridal funkciu „načítať obsah“, aby ste videli, čo sa stane, keď sa v prehliadači zobrazí posuvník, keď je vlastnosť pozadia-prílohy nastavená na pevnú. Môžete si tiež stiahnuť ukážku a hrať sa s hodnotami vlastností určovania polohy (napríklad príloha na pozadí a pozícia na pozadí), aby ste zistili, ako to ovplyvňuje posúvanie stránky a obrázok na pozadí. Ostatné hodnoty majetku sú dosť vysvetľujúce.

Skratka CSS

Podrobne som popísal vlastnosti pozadia, aby bolo jednoduchšie ich vysvetliť. Skrátený zápis bude tiež ekvivalentný:

telo (pozadie: url (pozadie-foto.jpg) stredný stredný kryt bez opakovania opravený;)

Všetko, čo musíte urobiť, je zmeniť hodnotu adresy URL tak, aby ukazovala na cestu k vášmu obrázku na pozadí.

Voliteľné: mediálny dopyt pre malé obrazovky

Pri malých obrazovkách som pomocou Photoshopu zmenšil pôvodný obrázok na pozadí proporcionálne na 768x505px a tiež som použil Smush.it na zmenšenie veľkosti o niečo ďalej. Tým sa zmenšila veľkosť súboru z 1741 kB na 114 kB. Títo. veľkosť obrázka zmenšená o 93%.

Nechápte ma zle, 114KB je stále dosť veľa na čisto estetický dizajnový prvok. Vzhľadom na dodatočnú réžiu 114 kB by som takýto súbor použil iba vtedy, ak by som videl príležitosť výrazne zlepšiť používateľský zážitok (UX). v súčasnosti značná časť internetového prenosu pochádza z pozadia mobilných zariadení - obrázok: adresa URL (obrázky / pozadie - fotografia - mobil - zariadenia. jpg);

Mediálny dotaz má maximálnu šírku: 767 pixelov, čo znamená, že ak je oblasť zobrazenia prehliadača väčšia ako 767 pixelov, načíta sa veľký obrázok na pozadí.

Nevýhodou použitia tohto mediálneho dotazu je, že ak zmeníte šírku okna svojho prehliadača, napríklad z 1 200 pixelov na 640 pixelov (alebo naopak), okamžite uvidíte okamih, kedy sa načíta malý alebo veľký obrázok na pozadí.

Navyše, vzhľadom na to, že niektoré zariadenia s malou obrazovkou môžu zobrazovať viac pixelov - napríklad iPhone 5 s displejom sietnice je schopný zobrazovať rozlíšenie 1136x640px - malý obrázok na pozadí bude pixelovaný.

Zhrnutie

Aktuálnejšiu verziu zdrojového kódu si môžete pozrieť v tomto návode na GitHub. Môžem vás len upozorniť na jednu vec: používajte túto techniku ​​opatrne, pretože veľké súbory môžu vážne poškodiť UX, najmä ak koncový používateľ používa pomalé a nespoľahlivé internetové pripojenie. To je ďalší dôvod, prečo by ste mali zvoliť vhodnú farbu pozadia, aby si používateľ mohol načítať obsah počas načítania obrázka na pozadí.

Veľké videá na pozadí webových stránok sú veľmi obľúbeným trendom webového dizajnu. Vďaka šikovne aplikovaným videám môže byť webová stránka pre používateľov dramatickejšia a pútavejšia.

Navyše, pozadie videa je možné prehrávať plynulo a bez „bŕzd“, na rozdiel od pozadia vytvoreného pomocou JavaScriptu, ktoré vyžadujú načítanie určitého kódu a obrázkov skôr, ako používateľ uvidí výsledok animácie.

Existujú spoločnosti ako Powerhouse alebo Adidas, ktoré používajú video ako pozadie webovej stránky na sprostredkovanie konkrétnej správy alebo príbehu o produkte alebo službe používateľovi.

Aj keď najpopulárnejším spôsobom vytvárania pozadia videa je používanie HTML5 video tag spolu s niektorými parametrami CSS, mali by ste tiež venovať pozornosť alternatívnym zdrojom videa, napríklad YouTube. V takom prípade si nemusíte robiť starosti s pomalou odozvou servera, pretože požiadavka bude odoslaná priamo na YouTube.

V tomto článku vám ukážem, ako môžete vytvoriť vynikajúci web, ktorý ako pozadie používa videá z YouTube. Na úpravu a kontrolu vzhľadu nášho videa použijeme súbor jQuery.mb.YTPlayer.js. Začnime teda!

Stiahnite si zdroje
Demo

Budete potrebovať:

// Veľký obsah na pozadí tu

Teraz musíte každú sekciu naplniť obsahom. Do sekcie s veľkým a malým pozadím umiestnite triedu vzor, na vytvorenie ľahkej textúry v našom videu. Musíte tiež pridať h1, h2, odsek a tlačidlo.