Artado Search'ten en iyi şekilde yararlanmak için onu varsayılan arama motorunuz olarak ayarlamak isteyebilirsiniz. Bunu şu şekilde yapabilirsiniz:
1. Google Chrome :
2. Firefox :
3. Microsoft Edge:
Temel Arama :
Artado Search'ü kullanmak basittir. Arama çubuğuna arama teriminizi girmeniz ve Enter tuşuna basmanız yeterlidir. Artado, alaka düzeyine ve tarihe göre sıralanmış ilgili sonuçların bir listesini döndürecektir.
Daha spesifik aramalar için gelişmiş arama özelliklerini kullanabilirsiniz:
"böyle") kullanarak tam olarak o cümleyi içeren sonuçları bulun.
-) kullanarak o kelimeyi içeren sonuçları hariç tutun.
site:example.com kullanın.
Örnek: yapay zeka sitesi:wikipedia.org
Artado Araması, temalar aracılığıyla görünümünü özelleştirmenize olanak tanır. Temaları nasıl oluşturabileceğiniz ve uygulayabileceğiniz aşağıda açıklanmıştır:
Uzantılar geliştirerek ve yükleyerek Artado Arama'nın işlevselliğini genişletin. Bunlar, sözlük aramaları, anında çeviri ve daha fazlası gibi özellikler ekleyebilen JavaScript tabanlı özel betiklerdir.
Artado Search, çeşitli ayarları düzenleyerek arama deneyiminizi özelleştirmenize olanak tanır. Ayarlara erişmek için:
Arama ayarlarınız gelecekteki oturumlar için kaydedilebilir. Ayarlarınızı kaydetmek için:
Artado Proxy'leri, Artado Search'e farklı sunucular üzerinden erişmenizi sağlayarak gizliliği ve erişimi artırır. Artado otomatik olarak sizi Artado veritabanındaki proxy'lerden birine bağlar. Proxy kurmak için:
Artado topluluk odaklı bir projedir ve katkıda bulunabileceğiniz birçok yol vardır:
Artado Search, "Bangs" adı verilen güçlü bir özelliği destekler. Bu özellik sayesinde, belirli web sitelerinde doğrudan arama yapabilirsiniz. Arama çubuğuna bang anahtar kelimesi ve ardından arama sorgunuzu yazarak, Artado'nun arama sonuçlarını atlayıp, hedef web sitesinin arama sonuçlarına doğrudan ulaşabilirsiniz.
Artado'da bangs kullanmak oldukça basittir. Arama çubuğuna bang anahtar kelimesini ve arama teriminizi yazın ve Enter tuşuna basın. Örneğin:
!g yapay zeka
-
Bu, sizi doğrudan Google'ın "yapay zeka" arama sonuçlarına götürecektir.
İşte Artado Search'de desteklenen bangs'lerin kapsamlı bir listesi ve işlevleri:
!g
- Google: Google'da doğrudan arama yapın.
!g iklim değişikliği
!w
- Wikipedia: Wikipedia'da bilgi arayın.
!w OpenAI
!yt
- YouTube: YouTube'da videolar arayın.
!yt makine öğrenmesi eğitimi
!a
- Amazon: Amazon'da alışveriş yapın.
!a kablosuz kulaklık
!tw
- Twitter: Twitter'da tweet arayın.
!tw OpenAI
!fb
- Facebook: Facebook'ta arama yapın.
!fb artado search
!r
- Reddit: Reddit başlıklarını tarayın.
!r web geliştirme
!gh
- GitHub: GitHub'da depolar arayın.
!gh artado search
!ama
- AMA (Ask Me Anything): AMA başlıklarını bulun.
!ama uzay keşfi
!d
- DuckDuckGo: DuckDuckGo'da arama yapın.
!d gizlilik araçları
!imdb
- IMDb: IMDb'de film ve dizi arayın.
!imdb Başlangıç
!ebay
- eBay: eBay'de alışveriş yapın.
!ebay vintage saatler
!netflix
- Netflix: Netflix'te film ve dizi arayın.
!netflix bilim kurgu
!maps
- Google Maps: Google Maps'te yerler arayın.
!maps New York City
!p
- Pinterest: Pinterest'te ilham arayın.
!p ev dekorasyon fikirleri
!so
- Stack Overflow: Stack Overflow'da kodlama soruları arayın.
!so JavaScript fetch API
!gmail
- Gmail: Gmail'de e-postalar arayın.
!gmail iş başvurusu
!gnews
- Google News: Google News'te haber makaleleri bulun.
!gnews teknoloji trendleri
!wp
- WhatsApp: WhatsApp Web'de sohbet arayın.
!wp buluşma
!img
- Google Görseller: Google'da görsel arayın.
!img gün batımı
!t
- Tumblr: Tumblr'da gönderiler arayın.
!t sanat illüstrasyon
!dic
- Dictionary.com: Kelime tanımları bulun.
!dic plethora
!th
- TheHackerNews: TheHackerNews'te makaleler arayın.
!th siber güvenlik
!net
- Netflix: Netflix'te başka bir arama yöntemi.
!net komedi filmleri
!y
- Yahoo: Yahoo'da arama yapın.
!y finans haberleri
!q
- Quora: Quora'da yanıtlar bulun.
!q girişim tavsiyeleri
!m
- Medium: Medium'da makaleler arayın.
!m üretkenlik ipuçları
!eb
- Etsy: Etsy'de el yapımı ve vintage ürünler bulun.
!eb el yapımı takılar
!hr
- HackerRank: HackerRank'te kodlama pratiği yapın.
!hr algoritmalar
!cra
- Craigslist: Craigslist'te ilanlar arayın.
!cra ikinci el arabalar
!o
- Outlook: Outlook'ta e-postalar arayın.
!o proje toplantısı
!drib
- Dribbble: Dribbble'da tasarımlar arayın.
!drib UI ilhamı
!it
- Instagram: Instagram'da gönderiler arayın.
!it seyahat fotoğrafçılığı
!gcal
- Google Calendar: Google Calendar'da etkinlikler arayın.
!gcal ekip toplantısı
!sc
- SoundCloud: SoundCloud'da müzik bulun.
!sc lo-fi beats
!wol
- Wolfram Alpha: Wolfram Alpha'da hesaplama bilgisi arayın.
!wol asal sayılar
!mz
- Moz: Moz'da SEO araçları ve makaleleri arayın.
!mz anahtar kelime araştırması
!npr
- NPR: NPR'de haber ve podcastler arayın.
!npr günlük haber podcasti
!ar
- Airbnb: Airbnb'de konaklama arayın.
!ar Paris dairesi
!cnn
- CNN: CNN'de haber makaleleri arayın.
!cnn seçim haberleri
!bbc
- BBC: BBC'de haber bulun.
!bbc dünya haberleri
!v
- Vimeo: Vimeo'da videolar arayın.
!v kısa filmler
!tpb
- The Pirate Bay: The Pirate Bay'de torrent arayın.
!tpb açık kaynak yazılım
!gdoc
- Google Docs: Google Docs'ta belgeler arayın.
!gdoc proje raporu
!wo
- WordPress: WordPress'te bloglar arayın.
!wo teknoloji blogu
!rt
- Rotten Tomatoes: Rotten Tomatoes'ta film puanları arayın.
!rt aksiyon filmleri
!ars
- Ars Technica: Ars Technica'da makaleler bulun.
!ars teknoloji haberleri
!ln
- LinkedIn: LinkedIn'de profiller ve işler arayın.
!ln yazılım mühendisi
!sl
- SlideShare: SlideShare'de sunumlar bulun.
!sl dijital pazarlama
!hn
- Hacker News: Hacker News'te teknoloji haberleri bulun.
!hn yazılım güncellemeleri
!twi
- Twitch: Twitch'te canlı yayınlar arayın.
!twi e-spor turnuvası
!me
- Meetup: Meetup'ta etkinlikleri bulun.
Örnek: !me photography group
!wik
- Wikipedia: Wikipedia'da arama yapmanın başka bir yolu.
Örnek: !wik yenilenebilir enerji
!ea
- Etsy: Etsy'de alışveriş yapmanın başka bir yolu.
Örnek: !ea özel hediyeler
!b
- Bing: Bing'de arama yapın.
Örnek: !b son teknoloji
!pay
- PayPal: PayPal'da işlemleri arayın.
Örnek: !pay son ödemeler
!dp
- Dropbox: Dropbox'ta dosyaları arayın.
Örnek: !dp istemci belgeleri
!fc
- Flickr: Flickr'da fotoğraf bulun. - Örnek: !fc doğa fotoğrafçılığı
!yelp
- Yelp: Yelp'te yorumları arayın.
Örnek: !yelp restoranları yakınımda
!vs
- VSCO: VSCO'da fotoğrafları bulun.
Örnek: !vs seyahat fotoğrafları
!fm
- Foursquare: Foursquare'de yerleri arayın.
Örnek: !fm kahve dükkanları
!gd
- Google: Google'da arama yapmanın başka bir yolu.
Örnek: !gd AI araştırması
!sp
- Spotify: Spotify'da müzik arayın.
Örnek: !sp egzersiz çalma listesi
!pg
- Pocket: Pocket'ta kaydedilmiş makaleleri bulun. - Örnek: !pg productivity tips
!ad
- Adobe: Adobe kaynaklarını arayın.
Örnek: !ad Photoshop eğitimleri
!gif
- Giphy: Giphy'de GIF'leri bulun.
Örnek: !gif happy dance
!ibm
- IBM: IBM'in sitesinde arayın.
Örnek: !ibm cloud services
!mf
- MyFitnessPal: MyFitnessPal'da beslenmeyi takip edin.
Örnek: !mf daily calorie intake
!sch
- Google Scholar: Google Scholar'da akademik makaleleri bulun.
Örnek: !sch artificial intelligence
!med
- MedicineNet: MedicineNet'te tıbbi bilgileri arayın. - Örnek: !med flu belirtileri
!az
- Azure: Microsoft Azure'da kaynakları arayın.
Örnek: !az cloud computing
!c
- CNET: CNET'te teknoloji haberlerini arayın.
Örnek: !c yeni akıllı telefonlar
!ga
- Google Analytics: Google Analytics'te raporları arayın.
Örnek: !ga kullanıcı etkileşim raporu
!md
- Mozilla Geliştirici Ağı (MDN): MDN'de belgeleri bulun.
Örnek: !md CSS grid
!al
- AliExpress: AliExpress'te alışveriş yapın.
!al akıllı telefon aksesuarları
Artado Search'te güçlü bir özellik olan patlamalar, en sevdiğiniz web sitelerini doğrudan aramanın hızlı ve etkili bir yolunu sunar. Hızlı bir şekilde bilgi bulmanız, alışveriş yapmanız veya belirli sitelere göz atmanız gerekip gerekmediğine bakılmaksızın, Artado'nun perçemleri size zaman kazandırabilecek bir kısayol sağlar.
Bunları deneyin ve Artado ile çevrimiçi aramalarınızı kolaylaştırın!
Bu kılavuz, ASP.NET Framework 4.8 ile geliştirilen Artado Search uygulamasını Windows sunucusunda barındırmak için adım adım talimatlar sağlar. Uygulamanızı kurmak ve dağıtmak için bu adımları izleyin.
Başlamadan önce, aşağıdakilere sahip olduğunuzdan emin olun:
IIS Yükleyin:
ASP.NET Kurulumunu Doğrulayın:
aspnet_regiis.exe -i komutunu çalıştırarak ASP.NET'i IIS ile kaydedin.
Uygulamayı Derleyin:
Uygulamayı Yayınlayın:
Yeni Bir Web Sitesi Oluşturun:
http://localhost:80).
Uygulama Havuzunu Yapılandırın:
İzinleri Ayarlayın:
IIS_IUSRS).
Bir Veritabanı Oluşturun:
Bağlantı Dizelerini Güncelleyin:
Web.config dosyasını açın.
<connectionStrings> bölümünü bulun.
Web Sitesini Tarayıcıda Açın:
http://localhost).
Günlükleri Kontrol Edin:
C:\inetpub\logs\LogFiles'te bulunur, uygulamaya özgü günlükler ise App_Data klasöründe olabilir.
HTTPS Kurulumu:
Düzenli Yedeklemeler:
Performansı İzleyin:
Olay Görüntüleyici ve IIS günlüklerini kontrol edin.
Bu adımları takip ederek Artado Search uygulamasını Windows sunucusunda çalışır hale getirebilirsiniz. Sorun yaşarsanız veya daha fazla yardıma ihtiyacınız olursa, resmi belgeleri inceleyin veya Artado topluluğundan yardım alın.
Bu kılavuz, ASP.NET Framework 4.8 ile geliştirilen Artado Search uygulamasını Linux sunucusunda barındırmak için talimatlar sağlar. ASP.NET Framework öncelikli olarak Windows için tasarlandığından, uygulamayı Linux üzerinde çalıştırmak için açık kaynaklı .NET Framework uygulaması olan Mono'yu kullanacağız.
Başlamadan önce aşağıdakilere sahip olduğunuzdan emin olun:
Mono Deposu Ekleme:
sudo apt update sudo apt install gnupg ca-certificates
sudo apt-key adv --keyserver hkp://keyserver.ubuntu.com:80 --recv-keys 0x0x0 sudo apt-add-repository 'deb http://download.mono-project.com/repo/ubuntu stable main'
Mono'yu Yükleyin:
sudo apt update sudo apt install mono-complete
Kurulumu Doğrulayın:
mono --version
Uygulamayı Derleyin:
Uygulamayı Yayınlayın:
Dosyaları Aktarın:
scp, rsync veya başka bir dosya aktarım yöntemi kullanarak Linux sunucunuza aktarın: scp -r /path/to/published/files username@linuxserver
:/path/to/deployment/folder
Uygulamanız İçin Bir Dizin Oluşturun:
sudo mkdir /var/www/artado
sudo chown $USER:$USER /var/www/artado
Uygulama Dosyalarınızı Taşıyın:
mv /path/to/deployment/folder/* /var/www/artado
Uygulamayı Çalıştırın:
Dizin içerisine gidin ve uygulamanızı Mono ile çalıştırın:
cd /var/www/artado mono ArtadoSearch.exe
Uygulamanın arka planda çalışmaya devam etmesini sağlamak için screen veya nohup kullanmayı düşünebilirsiniz:
nohup mono ArtadoSearch.exe &
Uygulamanızı HTTP/HTTPS üzerinden sunmak için, bir ters proxy olarak hareket edecek Nginx gibi bir web sunucusu yapılandırın.
Nginx'i Yükleyin:
sudo apt update sudo apt install nginx
Nginx'i Yapılandırın:
Web siteniz için yeni bir yapılandırma dosyası oluşturun:
sudo nano /etc/nginx/sites-available/artado
Aşağıdaki yapılandırmayı ekleyin:
server { listen
80; server_name your_domain_or_ip; location / { proxy_pass http://localhost:8080; # Mono'nun kullandığı portu değiştirin
proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme;
}
}
Yapılandırmayı bağlayın ve Nginx'i yeniden başlatın:
sudo ln -s /etc/nginx/sites-available/artado /etc/nginx/sites-enabled/ sudo systemctl restart nginx
SQL Server'ı Yükleyin veya Mevcut Bir Veritabanına Bağlanın:
Bağlantı Dizelerini Güncelleyin:
Web.config dosyasını açın.
<connectionStrings> bölümünü SQL Server örneğinize ve veritabanınıza işaret edecek şekilde güncelleyin.
Uygulamaya Erişin:
Günlükleri Kontrol Edin:
/var/log/ dizininde bulunur.
/var/log/nginx/ dizininde bulunur.
HTTPS Kurulumu:
sudo apt install certbot python3-certbot-nginx
sudo certbot --nginx
Düzenli Yedeklemeler:
Performansı İzleyin:
Bu adımları takip ederek Artado Search uygulamasını Linux sunucusunda çalıştırabilirsiniz. Sorun yaşarsanız veya daha fazla yardıma ihtiyacınız olursa, Mono belgelerine göz atın veya Artado topluluğundan yardım alın.
Bu kılavuz, ASP.NET Framework 4.8 ile geliştirilen Artado Search uygulamasını macOS sisteminde Mono kullanarak barındırmak için ayrıntılı talimatlar sağlar.
Başlamadan önce aşağıdakilere sahip olduğunuzdan emin olun:
Homebrew'ü Yükleyin (henüz kurulu değilse):
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
Homebrew Kullanarak Mono'yu Yükleyin:
brew
install mono
Kurulumu Doğrulayın:
mono --version
Uygulamayı Derleyin:
Uygulamayı Yayınlayın:
Dosyaları Aktarın:
scp, rsync gibi dosya paylaşım yöntemlerini veya dosyaları manuel olarak kopyalamayı kullanabilirsiniz.
Uygulamanız İçin Bir Dizin Oluşturun:
mkdir -p ~/artado
Uygulama Dosyalarınızı Taşıyın:
mv /path/to/deployment/folder/* ~/artado
Uygulamayı Çalıştırın:
Dizin içine gidin ve uygulamanızı Mono ile çalıştırın:
cd ~/artado
mono ArtadoSearch.exe
Uygulamanın arka planda çalışmaya devam etmesini sağlamak için nohup kullanmayı düşünebilirsiniz:
nohup mono ArtadoSearch.exe &
Uygulamanızı HTTP/HTTPS üzerinden sunmak için, bir ters proxy olarak hareket edecek Nginx gibi bir web sunucusu yapılandırın.
Homebrew Kullanarak Nginx'i Yükleyin:
brew
install nginx
Nginx'i Yapılandırın:
Web siteniz için yeni bir yapılandırma dosyası oluşturun:
sudo nano /usr/local/etc/nginx/servers/artado.conf
Aşağıdaki yapılandırmayı ekleyin:
server { listen
80; server_name your_domain_or_ip; location / { proxy_pass http://localhost:8080; # Mono'nun kullandığı portu değiştirin
proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme;
}
}
Nginx'i başlatın:
sudo nginx
Gerekirse Nginx yapılandırmasını yeniden yükleyin:
sudo nginx -s reload
SQL Server'ı Yükleyin veya Mevcut Bir Veritabanına Bağlanın:
Bağlantı Dizelerini Güncelleyin:
Web.config dosyasını açın.
<connectionStrings> bölümünü SQL Server örneğinize ve veritabanınıza işaret edecek şekilde güncelleyin.
Uygulamaya Erişin:
Günlükleri Kontrol Edin:
~/Library/Logs/ dizininde bulunur.
/usr/local/var/log/nginx/ dizininde bulunur.
HTTPS Kurulumu:
brew
install certbot
sudo certbot --nginx
Düzenli Yedeklemeler:
Performansı İzleyin:
Bu adımları takip ederek Artado Search uygulamasını macOS sisteminizde çalıştırabilirsiniz. Sorun yaşarsanız veya daha fazla yardıma ihtiyacınız olursa, Mono belgelerine göz atın veya Artado topluluğundan yardım alın.
Bu kılavuz, Artado Search için eklentiler oluşturmanıza yardımcı olacaktır. Eklentiler, Artado Search'e özel işlevler eklemenizi, kullanıcı deneyimini geliştirmenizi veya üçüncü taraf hizmetleri doğrudan Artado Search'e entegre etmenizi sağlar.
Artado Search için bir eklenti geliştirmek için HTML, CSS ve JavaScript hakkında temel bilgiye sahip olmanız gerekir. JavaScript, tarayıcıda çalışan güçlü bir dildir ve web sayfalarının içeriğini manipüle etmenize, API'lerle etkileşime girmenize ve daha fazlasını yapmanıza olanak tanır. JavaScript'in temellerini öğrenmek için bu belgeleri inceleyebilirsiniz.
Yeni Bir JavaScript Dosyası Oluşturun:
.js dosyası oluşturun.
Temel Yapı:
Başlamak için basit bir şablon:
if (window.location.pathname === "/search") { // Kullanıcı arama sayfasındaysa kodu çalıştırır
const urlParams = new URLSearchParams(window.location.search); const search = urlParams.get('i').replace("+", " ").trim()
.replace(/[!"#\$%&'\(\)\*\+,-\.\/:;<=>\?@\[\\\]\^_`{\|}~]/g, "").replace(/ +/g, " "); // Aranan sorguyu alır
const searches = [ "whats my ip", "what is my ip", "what my ip", "my ip",
]; if (searches.includes(search)) { // Sorgunun IP ile ilgili olup olmadığını kontrol eder fetch('https://api.ipify.org?format=json')
.then(
response =>
response.json())
.then(
data =>
{ var element = document.createElement("div"); // Arama sayfasına bir element oluşturur element.className = "card";
element.style = "border: 1px solid #bdbdbd; text-transform: none";
element.innerHTML = `<p>Your IP address is: <code>${data.ip}</code></p>`
; document.getElementById("web_results").insertBefore(element, document.getElementById("web_results").firstChild);
});
}
}
Eklentiyi Yükleme:
Test Etme:
F12 veya Ctrl+Shift+I) kullanarak sayfayı inceleyin, eklentinizi çalıştırın ve sorunları çözün.
Artado Search arayüzünü, özel HTML ekleyerek veya mevcut öğeleri değiştirerek de değiştirebilirsiniz:
(function() {
// Arama çubuğuna özel bir düğme ekler
let button = document.createElement("button"); button.innerText = "Özel İşlem"
; button.onclick = function() {
alert("Düğmeye tıklandı!"); }; document.querySelector("#searchbar").appendChild(button); })();
Elbette, işte "Artado Teması Nasıl Geliştirilir" başlıklı kılavuzun Türkçe çevirisi ve Markdown formatında:
# Artado Teması Nasıl Geliştirilir Bu kılavuz, [Artado Search](https://www.artadosearch.com) için özel bir tema oluşturma sürecini anlatacaktır. CSS'e yeni başlayan biri veya deneyimli bir geliştirici olsanız da, Artado için benzersiz bir görünüm tasarlamanız için gereken adımları ve ipuçlarını bulacaksınız. ## Başlarken Artado Search için bir tema oluşturmak için öncelikle CSS ile çalışacaksınız. Temanızı oluştururken değişiklikleri gerçek zamanlı olarak görmenizi sağlayan [Stylus Editor](https://add0n.com/stylus.html) kullanabilirsiniz. ### Stylus Editor'ü Kurma
1.
**Stylus'u Kurun**: Öncelikle, Stylus tarayıcı eklentisini [Chrome Web Store](https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne) veya [Firefox Add-ons](https://addons.mozilla.org/en-US/firefox/addon/styl-us/) üzerinden yükleyin. 2.
**Stylus Editor'e Erişim**:
- Tarayıcınızın araç çubuğunda Stylus simgesine tıklayın.
- **Yönet** seçeneğini seçerek stillerinizin bulunduğu sayfaya gidin.
- **Yeni Stil Yaz** butonuna basarak temanın oluşturulmasına başlayın. ### Temanızı Ayarlama
-
**Artado Search'i Hedefleme**: Stylus Editor'de "Uygulandığı Yerler" ayarını sadece `https://www.artadosearch.com` olarak değiştirin. Bu, temanızı sadece Artado Search'e uygulamanızı ve ziyaret ettiğiniz diğer siteleri etkilememesini sağlar. ## Temel Özellikler
### Arka Plan Resmi Ekleme Arka planı özelleştirmek, temanızı oluştururken tonu belirlemenin harika bir yoludur. #### Ana Sayfa Arka Planı Sadece ana arama sayfasında görünen bir arka plan resmi eklemek için: ```css
#homepage {
background: url("Resim linki") no-repeat center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
Arka plan resmini tüm sayfalara, arama sonuçları ve ayarlar dahil, uygulamak için:
body { background-image: url("Resim linki");
}
Arama çubuğu, sayfadaki en belirgin öğelerden biridir. İşte nasıl özelleştirebileceğiniz:
#searchbar { margin-bottom: 200px; width: 550px
!important; /* Auto Complete List genişliğiyle uyumlu olmasını sağlar */
border-radius: 10px; /* Köşeleri yumuşatır */ }
#searchinput { background-color: rgb(0, 0, 0); /* Giriş alanı arka plan rengi */
color: rgb(255, 255, 255); /* Metin rengi */ }
#searchbutton { color: rgb(255, 255, 255); /* Büyüteç simgesinin rengi */
background-color: rgb(0, 0, 0); /* Düğme arka plan rengi */ }
Alt çubuğu, genel temayla uyumlu olacak şekilde stilize edilebilir:
#features
.flex-wrap { padding-bottom: 20px; /* Padding'i istediğiniz gibi ayarlayın */
padding-top: 20px; color: #fff; /* Metin rengi */
background-color: #000; /* Arka plan rengi */ }
Etkileşimli öğeler için üzerine gelme efektleri eklemek:
#searchbutton
:hover { background-color: rgb(255, 165, 0); /* Üzerine gelindiğinde düğme rengini değiştirir */
color: #000; /* Üzerine gelindiğinde metin/simge rengini değiştirir */ }
Yazı tipi ve metin stillerini özelleştirmek için:
body { font-family: 'Arial', sans-serif; font-size: 16px; color: #333; /* Temel metin rengi */ } h1, h2, h3 { font-family: 'Georgia', serif; color: #444;
}
Artado topluluğu tarafından oluşturulan bu örnek temalara göz atarak ilham alabilirsiniz:
Temanızı geliştirirken tarayıcı geliştirici araçlarını (F12 veya Ctrl+Shift+I) kullanarak sayfayı inceleyin, CSS değişikliklerini test edin ve sorunları çözün.
Bu, sadece başlangıç. Daha karmaşık temalar oluşturmakla ilgileniyorsanız, CSS dünyasına daha derinlemesine dalabilirsiniz:
Temanızı oluşturduktan sonra, toplulukla paylaşabilirsiniz! Temanızı Artado Devs üzerinden yükleyebilirsiniz:
Bu kılavuz, Artado Search için özel temalar oluşturma ve paylaşma konusunda size güçlü bir temel sağlamalıdır. Farklı stillerle denemeler yaparken ve Artado Search'i kendinize özgü hale getirirken keyif alın!
İşte
"Artado Eklentisi Nasıl Geliştirilir"
başlıklı kılavuzun Türkçe çevirisi ve Markdown formatında:
Artado Eklentileri, Artado Search için JavaScript kullanarak özel işlevsellik eklemenizi sağlar. Bu kılavuz, JavaScript'in temellerini anlamanıza yardımcı olacak ve kendi eklentilerinizi geliştirmek için adım adım bir süreç sunacaktır.
Artado Search için bir eklenti oluşturmak için temel JavaScript bilgisine sahip olmanız gerekecek. JavaScript, tarayıcıda çalışan güçlü bir dildir ve web sayfalarının içeriğini değiştirmeye, API'lerle etkileşimde bulunmaya ve daha fazlasına olanak tanır.
Eklenti geliştirmeye başlamadan önce bazı temel JavaScript kavramlarını gözden geçirelim:
Değişkenler: Verileri depolamak için kullanılır.
const name = "Artado"; let searchQuery = "JavaScript";
Fonksiyonlar: Belirli görevleri yerine getiren kod bloklarıdır.
function
greetUser()
{ console.log("Artado Search'e hoş geldiniz!");
}
Koşullar: Koşullara göre farklı kodların çalıştırılmasını sağlar.
if (searchQuery === "JavaScript") {
console.log("JavaScript öğreniyorsunuz!");
} else {
console.log("Başka bir şey arayın.");
}
Döngüler: Bir kod bloğunu birden fazla kez tekrarlar.
for (let i = 0; i < 5; i++) {
console.log("Döngü tekrarı " + i);
}
DOM Manipülasyonu: JavaScript, Web Sayfalarının içeriğini ve görünümünü değiştirmek için Document Object Model (DOM) ile etkileşimde bulunabilir.
let heading = document.querySelector('h1');
heading.style.color = 'blue';
JavaScript kodunuzu doğrudan tarayıcıda test edebilirsiniz:
Geliştirici Araçlarını Açın:
JavaScript Çalıştırın:
Örnek:
console.log("Artado Search'ten merhaba!");
Bu mesajı konsolda göreceksiniz.
Arama sonuçları sayfasında veri getiren basit bir Artado eklentisi oluşturalım.
Bu eklenti, arama sorgusunu alacak ve bir sözlük API'sinden kelimenin tanımını alacaktır.
// "i" sorgu dizesi parametresini al
const queryString = window.location.search; const urlParams = new URLSearchParams(queryString); const query = urlParams.get('i'); // Bir sorgu olup olmadığını kontrol et
if (query) { const apiUrl = `https://api.dictionaryapi.dev/api/v2/entries/en/${query}`
; // Sonuçları görüntülemek için yeni bir element oluştur
const resultElement = document.createElement('div');
resultElement.id = 'result';
resultElement.style.textAlign = 'left';
resultElement.style.marginLeft = '100px';
resultElement.style.maxWidth = '500px';
resultElement.style.backgroundColor = 'transparent';
resultElement.style.border = "1px solid #bdbdbd";
resultElement.style.borderRadius = "10px";
resultElement.style.lineHeight = "20px";
resultElement.style.padding = "10px"; // Küçük ekranlar için medya sorgusu
const mediaQuery = window.matchMedia('(max-width: 768px)'); if (mediaQuery.matches) {
resultElement.style.marginRight = 'auto';
resultElement.style.marginLeft = 'auto';
} // API'ye istek gönder fetch(apiUrl)
.then(
response =>
response.json())
.then(
data =>
{ // JSON yanıtını işleme
const wordData = data[0]; const word = wordData.word; const phonetics = wordData.phonetics; const meanings = wordData.meanings; // HTML temsilini oluştur
let html = `<h2>${word}</h2>`
; if (phonetics && phonetics.length > 0) {
html += '<h3>Fonetikler</h3>';
phonetics.forEach(
phonetic =>
{
html += `<p>${phonetic.text}</p>`
; if (phonetic.audio) {
html += `<audio controls><source src="${phonetic.audio}" type="audio/mpeg"></audio>`
;
}
});
} if (meanings && meanings.length > 0) {
html += '<h3>Anlamlar</h3>';
meanings.forEach(
meaning =>
{
html += `<p><strong>${meaning.partOfSpeech}</strong></p>`
;
meaning.definitions.forEach(
definition =>
{
html += `<p>${definition.definition}</p>`
;
});
});
} // Üretilen HTML içeriğini ayarla resultElement.innerHTML = html; // resultElement'i sayfaya ekle
const buttons = document.getElementById('buttons_r');
buttons.insertAdjacentElement('afterend', resultElement);
})
.catch(
error =>
{ console.error('Veri alırken hata:', error);
});
}
Sorgu Dizesini Al: Kullanıcının girdiği arama terimini almak için i sorgu dizesi parametresini alıyoruz.
Bir Sorgunun Var Olup Olmadığını Kontrol Et: Eğer bir arama terimi varsa, sözlük API'sinden veri getirmeye devam ediyoruz.
Sonuç Elementi Oluştur: Sayfada sonuçları göstermek için yeni bir div elementi oluşturuyoruz.
API'den Veri Getir: fetch fonksiyonunu kullanarak sözlük API'sine istek gönderiyoruz.
Veriyi İşleyip Görüntüle: Veriyi aldıktan sonra HTML içeriğini oluşturup sayfaya ekliyoruz.
Eklenti kodunuzu doğrudan tarayıcı konsolunda test edebilirsiniz:
Bu, eklentinizin nasıl çalıştığını görmenizi sağlar ve gerekirse ayarlamalar yapmanıza olanak tanır.
Eklentinizden memnun kaldığınızda, Artado Search'te kullanılmak üzere yayınlayabilirsiniz.
Eklentinizi Artado topluluğuyla paylaşmak için Artado Devs üzerinden yükleyebilirsiniz:
JavaScript çok yönlü bir dildir ve her zaman öğrenilecek daha fazla şey vardır. İşte bilginizi derinleştirmek için bazı kaynaklar:
Artado Search için eklentiler oluşturmak, deneyiminizi özelleştirmek ve yeni işlevler eklemek için harika bir yoldur. Biraz JavaScript bilgisiyle, arama deneyiminizi geliştiren güçlü araçlar oluşturabilir ve toplulukla paylaşabilirsiniz. İyi kodlamalar! ```
Artado Software Sizlere özgür ve açık kaynaklı toplumu ekosistem ve kapalı kaynaklardan kurtarmak için geliştiriliyor
Ürünlerimiz• Copyright 2024 Artado Software •