A weben a tartalom megoszt\u00e1s nagy r\u00e9sze „m\u00e1sol\u00e1s\/beilleszt\u00e9s” m\u00f3dszerrel t\u00f6rt\u00e9nik. Biztosan tal\u00e1lkoztunk m\u00e1r olyan oldallal, ahol ha kim\u00e1soltunk egy sz\u00f6veget a tartalomb\u00f3l, akkor nem csak a kim\u00e1solt r\u00e9szt kaptuk vissza. Ilyenkor a hozz\u00e1f\u0171z\u00f6tt sz\u00f6veg \u00e1ltal\u00e1ban egy cselekv\u00e9sre \u00f6szt\u00f6nz\u0151 r\u00f6vid mondat egy linkel kieg\u00e9sz\u00edtve.<\/strong><\/p>\n

Ennek a megold\u00e1snak van j\u00f3 \u00e9s rossz oldala is. SEO szempontj\u00e1b\u00f3l eg\u00e9sz j\u00f3 m\u00f3dszer, hiszen sok hivatkoz\u00e1s mutat majd \u00edgy az oldalunkra, valamint az \u00edgy megosztott tartalmat nem lesz neh\u00e9z felkeresnie az \u00e9rdekl\u0151d\u0151knek.<\/p>\n

Azonban ez a m\u00f3dszer sok esetben bosszant\u00f3 is lehet, p\u00e9ld\u00e1ul ha sokszor m\u00e1sulunk egy adott oldalr\u00f3l, ahol alkalmazz\u00e1k ezt a megold\u00e1st. V\u00e9lem\u00e9nyem szerint a legnagyobb probl\u00e9ma, hogy a felhaszn\u00e1l\u00f3 nem tudja, hogy a kim\u00e1solt sz\u00f6veget m\u00e1s form\u00e1ban kapja vissza, hiszen nem ez a megszokott megold\u00e1s.<\/p>\n

A m\u00f3dszer haszn\u00e1lata, mint oly sok dolog sz\u00e1mos t\u00e9nyez\u0151t\u0151l f\u00fcgg \u00e9s nek\u00fcnk kell eld\u00f6nten\u00fcnk, hogy haszn\u00e1ljuk-e, vagy sem.<\/p>\n

Megval\u00f3s\u00edt\u00e1s<\/h3>\n

<<\/span>script type=<\/span>'text\/javascript'<\/span>><\/span>
\n        function<\/span> addLink(<\/span>)<\/span> {<\/span>
\n            if<\/span> (<\/span>window.getSelection<\/span>(<\/span>)<\/span>.containsNode<\/span>(<\/span>document.getElementsByClassName<\/span>(<\/span>'content'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>,<\/span> true<\/span>)<\/span>)<\/span> {<\/span>
\n
\n                var<\/span> body_element,<\/span>
\n                    selection,<\/span>
\n                    pagelink,<\/span>
\n                    copy_text,<\/span>
\n                    new_div;<\/span>
\n
\n                body_element =<\/span> document.getElementsByTagName<\/span>(<\/span>'body'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>;<\/span>
\n                selection =<\/span> window.getSelection<\/span>(<\/span>)<\/span>;<\/span>
\n
\n                pagelink =<\/span> " - Olvass tov\u00e1bb a k\u00f6vetkez\u0151 c\u00edmen: <a href='http:\/\/blog.webshark.hu'>webshark.hu<\/a>"<\/span>;<\/span>
\n             
\n                copy_text =<\/span> selection +<\/span> pagelink;<\/span>
\n
\n                new_div =<\/span> document.createElement<\/span>(<\/span>'div'<\/span>)<\/span>;<\/span>
\n                new_div.style<\/span>.left<\/span> =<\/span> '-99999px'<\/span>;<\/span>
\n                new_div.style<\/span>.position<\/span> =<\/span> 'absolute'<\/span>;<\/span>
\n                body_element.appendChild<\/span>(<\/span>new_div )<\/span>;<\/span>
\n
\n                new_div.innerHTML<\/span> =<\/span> copy_text;<\/span>
\n
\n                selection.selectAllChildren<\/span>(<\/span>new_div)<\/span>;<\/span>
\n
\n                window.setTimeout<\/span>(<\/span>function<\/span>(<\/span>)<\/span> {<\/span>
\n                    body_element.removeChild<\/span>(<\/span>new_div)<\/span>;<\/span>
\n                }<\/span>,<\/span>0<\/span>)<\/span>;<\/span>
\n            }<\/span>
\n        }<\/span>
\n
\n        document.oncopy<\/span> =<\/span> addLink;<\/span>
\n
\n<\/<\/span>script><\/span><\/div><\/div>\n

A f\u00fcggv\u00e9ny h\u00edv\u00e1s\u00e1t a dokumentum oncopy<\/tt> esem\u00e9ny\u00e9hez k\u00f6tj\u00fck, ami ahogy a neve is utal r\u00e1, akkor fut le, ha valaki sz\u00f6veget m\u00e1sol a dokumentumunkb\u00f3l.<\/p>\n

A f\u00fcggv\u00e9ny elej\u00e9n tal\u00e1lhat\u00f3 felt\u00e9tellel meghat\u00e1rozzuk, hogy csak a content<\/tt> oszt\u00e1ly kijel\u00f6l\u0151vel rendelkez\u0151 elemeinken fusson le a kijel\u00f6l\u00e9s, ami ebben az esetben a t\u00e9nyleges sz\u00f6veges tartalom.<\/p>\n

Az if-ben tal\u00e1lhat\u00f3 window.getSelection()-el<\/tt> visszakapjuk a kijel\u00f6lt objektumot, a containsNode-al<\/tt> pedig ellen\u0151rizz\u00fck, hogy a kijel\u00f6l\u00e9s a content class-al ell\u00e1tott ter\u00fcleten bel\u00fcl tal\u00e1lhat\u00f3-e.<\/p>\n

Ezt k\u00f6vet\u0151en l\u00e9trehozzuk a kijel\u00f6l\u00e9shez hozz\u00e1kapcsoland\u00f3 sz\u00f6veget, amit azt\u00e1n egybef\u0171z\u00fcnk a kijel\u00f6l\u00e9s sz\u00f6veg\u00e9vel. Mivel a kijel\u00f6l\u00e9s\u00fcnket, csak \u00fagy tudjuk m\u00f3dos\u00edtani, hogy egy megl\u00e9v\u0151 elemmel \u00e9s annak tartalm\u00e1val lecser\u00e9lj\u00fck az aktu\u00e1lis kijel\u00f6l\u00e9st, l\u00e9tre kell hoznunk egy \u00faj HTML elemet amibe innerHTML-el<\/tt> beillesztj\u00fck az \u00faj sz\u00f6veg\u00fcnket. Ezt az elemet a kijel\u00f6l\u00e9s friss\u00edt\u00e9se ut\u00e1n t\u00f6r\u00f6lj\u00fck!<\/p>\n

WordPress<\/h3>\n

WordPress eset\u00e9ben a fenti k\u00f3dot functions.php-n vagy egyedi b\u0151v\u00edtm\u00e9nyen kereszt\u00fcl is beilleszthetj\u00fck. Ehhez haszn\u00e1ljuk a wp_head<\/tt> akci\u00f3 hook-ot, az al\u00e1bbi m\u00f3don!<\/p>\n

function<\/span> add_read_more_text(<\/span>)<\/span> {<\/span>
\n\/\/ Ide j\u00f6n a JS k\u00f3d, ne lez\u00e1rni, majd \u00fajra megnyitni a PHP k\u00f3dblokkot!<\/span>
\n}<\/span>
\n
\nadd_action(<\/span> 'wp_head'<\/span>,<\/span> 'add_read_more_text'<\/span>)<\/span>;<\/span><\/div><\/div>\n

\u00d6sszefoglal\u00e1s<\/h3>\n

F\u0151k\u00e9nt a rendszer\u00fcnk\u00f6n m\u00falik, hogy milyen hivatkoz\u00e1st \u00e1ll\u00edtunk el\u0151. Ha a sablonf\u00e1jl fejl\u00e9c\u00e9ben helyezz\u00fck el a k\u00f3dot, \u00fagy k\u00f6nnyed\u00e9n adhatjuk hozz\u00e1 a CMS-\u00fcnk \u00e1ltal ny\u00fajtott, a megfelel\u0151 hivatkoz\u00e1s lek\u00e9rdez\u00e9s\u00e9re szolg\u00e1l\u00f3 f\u00fcggv\u00e9nyeket.
\n