- - Kaip sukurti ir pridėti mygtuką „Firefox“ naršymo įrankių juostoje [Vadovas]

Kaip sukurti ir pridėti mygtuką „Firefox“ naršymo įrankių juostoje [Vadovas]

Šiandien mes pateikiame tą „Firefox“ vadovąbet kas gali sekti, norėdamas naršymo įrankių juostoje sukurti pasirinktinį mygtuką. Kartu su matomais mygtukais naršymo įrankių juostoje yra sąrašas kitų mygtukų, turinčių skirtingas funkcijas „Firefox“, kuriuos galima pridėti bet kurioje įrankių juostos vietoje ir kuriuos galima pritaikyti pagal jūsų poreikius. Mygtuko padėtis ir elgsena gali būti keičiami nereikalaujant jokių papildomų žinių, todėl nesunkiai galite sukurti naują plėtinį, kuris veikia kaip nurodyta, sėdi apibrėžtoje padėtyje ir yra lengvai pritaikomas. Šiame įraše aprašoma, kaip sukurti paprastą plėtinį - įrankių juostos mygtuką, kuris užtikrins paprastą funkciją.

Norėdami pradėti, pirmiausia turite sužinoti plėtiniai aplankas (kuris yra aplanke „Firefox“ profiliai). „Windows 7“ ir „Windows Vista“ vartotojai šį aplanką ras čia;

C: Vartotojai << vartotojo vardas >> AppDataRoamingMozillaFirefoxProfiles << profilio vardas >> plėtiniai

Tačiau jei naudojate „Windows XP“, įveskite %Programos duomenys% „Windows“ konsolėje ir paspauskite Enter.

Dabar atidarykite „Firefox“ aplanką, tada - Profiliai -> <Profilio vardas> -> plėtinių aplankas

Kartą plėtiniai atidaromas aplankas, sukurkite naują aplanką pavadinimu [email protected] inicia.

aplankas13

Atidarykite naujai sukurtą aplanką ir sukurkite naują katalogą chromas, kartu su dviem failais - chromas.manifestas ir install.rdf. Dabar mes redaguosime šiuos failus teksto rengyklėje, manome, kad naudosite bet kurį redaktorių su „utf-8“ palaikymu, pvz., „Windows“ įmontuotą užrašų knygelę.

Pirmiausia atidarykite chromas.manifestas failą ir įterpkite šias kodo eilutes init. Žemiau pateiktas kodas taip pat veikia „Thunderbird“ pašto, rašymo ir adresų knygos languose bei „Sunbird“. Tačiau, jei jums reikia naudoti mygtuką tik „Firefox“, „Thunderbird“ ir „Sunbird“ kodo eilutės gali būti neįtrauktos.

content custombutton chrome/
style chrome://global/content/customizeToolbar.xul chrome://custombutton/content/button.css
# Firefox
overlay    chrome://browser/content/browser.xul chrome://custombutton/content/button.xul
# Thunderbird mail
overlay    chrome://messenger/content/messenger.xul chrome://custombutton/content/button.xul
# Thunderbird compose
overlay    chrome://messenger/content/messengercompose/messengercompose.xul chrome://custombutton/content/button.xul
# Thunderbird address book
overlay    chrome://messenger/content/addressbook/addressbook.xul chrome://custombutton/content/button.xul
# Sunbird
overlay    chrome://calendar/content/calendar.xul chrome://custombutton/content/button.xul

Įrašę kodą faile, išsaugokite pakeitimus, uždarykite jį. Dabar redaguokite install.rdf failą, turite įterpti šias kodo eilutesjame. Galite pakeisti mygtuko bendrą aprašą, tekstą galite pridėti 6, 7 ir 8 kodo eilutėse (turi būti įterpti į kabutes), galite įvesti mygtuko pavadinimą, aprašomąjį tekstą ir kūrėjo vardą.

<?xml version="1.0"?>
<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:em="http://www.mozilla.org/2004/em-rdf#">
<Description about="urn:mozilla:install-manifest"
em:name="AT"
em:description="AddictiveTips"
em:creator="Usman"
em:id="[email protected]"
em:version="1.0"
em:homepageURL="http://developer.mozilla.org/en/docs/Custom_Toolbar_Button"
em:iconURL="chrome://custombutton/content/icon.jpg" >
<em:targetApplication><!-- Firefox -->
<Description
em:id="{ec8030f7-c20a-464f-9b0e-13a3a9e97384}"
em:minVersion="1.4"
em:maxVersion="99" />
</em:targetApplication>
<em:targetApplication><!-- Thunderbird -->
<Description
em:id="{3550f703-e582-4d05-9a08-453d09bdfdc6}"
em:minVersion="1.4"
em:maxVersion="99" />
</em:targetApplication>
<em:targetApplication><!-- Sunbird -->
<Description
em:id="{718e30fb-e89b-41dd-9da7-e25a45638b28}"
em:minVersion="0.2.9"
em:maxVersion="99" />
</em:targetApplication>
<em:file>
<Description
about="urn:mozilla:extension:custombutton"
em:package="content/custombutton/" />
</em:file>
</Description>
</RDF>

Pakeitę aprašą, išsaugokite pakeitimus ir uždarykite failą. Prisiminti naujai sukurtą aplanką (chromas), kur sukursime 3 failus ir įterpsime 2 vaizdus. Pirmiausia sukurkite 3 failus šiais pavadinimais;

  • button.css
  • button.xul
  • button.js

Dabar mes pritaikysime stilių mygtukui tenčia nėra nieko sudėtinga, tiesiog mygtuko dizainą pritaikysime pagrindiniu stiliumi (apibrėžkite vaizdo matmenis ir užveskite pelės mygtuką). Jei esate susipažinęs su CSS failo („Cascading Style Sheet“) projektavimu, keisite reikšmes ir efektus - tai bus keblu, tačiau, jei girdite jo pavadinimą pirmą kartą, tiesiog įdėkite šias stiliaus kodo eilutes: button.css Baigę failą išsaugokite pakeitimus ir uždarykite.

#custom-button-1,
#wrapper-custom-button-1
{list-style-image: url("chrome://custombutton/content/button-1.jpg");}
/* common style for all custom buttons */
.custombutton                    {-moz-image-region: rect( 0px 24px 24px  0px);}
.custombutton:hover       {-moz-image-region: rect(24px 24px 48px  0px);}
[iconsize="small"] .custombutton
{-moz-image-region: rect( 0px 40px 16px 24px);}
[iconsize="small"] .custombutton:hover
{-moz-image-region: rect(24px 40px 40px 24px);}

Dabar atidarykite button.xul įrašykite į teksto rengyklę ir įterpkite šias eiluteskodo. Atminkite, kad mes taip pat teikiame „Thunderbird“ ir „Sunbird“ kodus. Jei sekėte šį vadovą tik „Firefox“, galite išskirti eilutes, susijusias su „Thunderbird“ ir „Sunbird“.

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/css"
href="chrome://custombutton/content/button.css"?>
<!DOCTYPE overlay >
<overlay id="custombutton-overlay"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script type="application/javascript"
src="chrome://custombutton/content/button.js"/>
<!-- Firefox -->
<toolbarpalette id="BrowserToolbarPalette">
<toolbarbutton id="custom-button-1"/>
</toolbarpalette>
<!-- Thunderbird mail -->
<toolbarpalette id="MailToolbarPalette">
<toolbarbutton id="custom-button-1"/>
</toolbarpalette>
<!-- Thunderbird compose -->
<toolbarpalette id="MsgComposeToolbarPalette">
<toolbarbutton id="custom-button-1"/>
</toolbarpalette>
<!-- Thunderbird address book -->
<toolbarpalette id="AddressBookToolbarPalette">
<toolbarbutton id="custom-button-1"/>
</toolbarpalette>
<!-- Sunbird -->
<toolbarpalette id="calendarToolbarPalette">
<toolbarbutton id="custom-button-1"/>
</toolbarpalette>
<!-- button details -->
<toolbarbutton id="custom-button-1"
label="Custom"
tooltiptext="My custom toolbar button"
oncommand="CustomButton[1]()"
class="toolbarbutton-1 chromeclass-toolbar-additional custombutton"
/>
</overlay>

Dabar reikia įterpti du vaizdų failus su pavadinimais button-1.jpg ir Icon.jpg kurių matmenys yra atitinkamai 40 × 48 ir 48 × 48gauti geriausius rezultatus. Tačiau galite sukurti bet kokio dydžio vaizdus, ​​ne didesnius kaip 48 taškų pločio ir ilgio. Žemiau galite pamatyti mygtukų vaizdus, ​​kuriuos naudojame - button-1.jpg vaizdas yra įrankių juostos mygtuko su atitinkamais dydžiais (didelis ir mažas), o pelės žymeklio efektas gali būti matomas po abiejų numatytųjų vaizdų dydžiais. Icon.jpg vaizdas nurodo pagrindinio plėtinio piktogramos vaizdą (tą, kurį matysite „Firefox“ plėtinių galerijoje)

button-1.jpg

mygtukas-1up

Icon.jpg

Piktograma

Sukūrę, pereikite prie 5-ojo failo - mygtukas.js. Šis „JavaScript“ failas turi didelę reikšmę,nes tai apibrėžs pagrindinį mygtuko funkcionalumą. Galite pridėti scenarijaus pavyzdį, kuris paragina pranešimą išbandyti jo funkcionalumą, arba galite ieškoti scenarijaus iš anksto, kad padarytumėte viską, ko norite. Be to, yra daugybė scenarijų, įmanomų patenkinti visus reikalavimus, čia galite patikrinti keletą paprastų, bet naudingų scenarijų. Kadangi šis vadovas skirtas pradinio lygio vartotojams, mes sukursime paprastą žymės elementą, kuris atidarys nurodytą svetainę. Atidaryk button.js failą ir įdėkite šias kodo eilutes, norėdami sukurti žymės mygtuką (rodyti „Firefox“ įrankių juostoje).

CustomButton = {
1: function () {
const url = "https://www.addictivetips.com/"
document
.getElementById("content")
.webNavigation
.loadURI(url, 0, null, null, null)
},
}

Dabar jums gera eiti, mes manome, kad jums patikrintikodą, kurį įdėjote į minėtus failus, ir dar kartą patikrinkite vaizdo matmenis. Norėdami įdiegti naujai sukurtą plėtinį, uždarykite visus veikiančius „Firefox“ egzempliorius ir paleiskite jį. Jei viskas klostėsi gerai, tikriausiai pamatysite naują priedų diegimo raginimą, nurodantį, kad plėtinys sėkmingai įdiegtas.

naujas adonas

Norėdami, kad naujai sukurtas mygtukas pasirodytų naršymo įrankių juostoje, meniu „Rodinys“, esančiame „Subdomen“ įrankių juostos, spustelėkite „Tinkinti“.

pritaikyti -2

Pasirodys dialogo langas Tinkinti įrankių juostą iš kurnaujai sukurtą mygtuką turite vilkti virš naršymo įrankių juostos. Įdėję taip pat galite pakeisti jo padėtį, vilkdami bet kur, kur norite.

3 mygtukas

Dabar tiesiog spustelėkite mygtuką, kad patikrintumėte „JavaScript“ faile įterptas funkcijas.

mygtukas naujas1

Rezultatas yra mygtuko funkcionalumasvartotojo apibrėžtą, todėl jūsų įgūdžiai priklauso, kiek galite kalibruoti jo funkcijas. Pradedantieji vartotojai gali kurti nuorodas, susieti programas, kurti žymes, tuo tarpu vartotojai, turintys ribą tarp vidutinio ir ekspertų lygio, tikrai gali juo labiau naudotis ir pagrindiniame „Java“ faile pridėti reikiamas funkcijas.

Komentarai