WBDSGNR - Real Life Implement: 2025

Friday, 26 September 2025

Chatbot Telegram development

🔹 FLOW BOT (berdasarkan code kau)

1. Update masuk dari Telegram

Bot terima JSON dari php://input.
Extract:
- chat_id
- firstname
- text
- (juga handle kalau update datang dari callback_query).

2. Handle Special Case

User baru join group
- Bot hantar mesej welcome dalam group.
- Bot juga cuba hantar DM private welcome.
Lead Capture Check
- Panggil handleLeadCapture() (daripada lead-capture.php).
- Kalau match keyword dari Sheet tab Redirect, terus masuk flow lead capture.

3. Session Handler

Session user disimpan dalam sessions.json.
Ada check:
- active / not active
- last_activity
- mode → exact atau contains
- Timeout → 5 minit (kalau lebih, sesi auto tamat).

4. Commands

/start
- Kalau ada param → terus treat param tu sebagai keyword.
- Kalau tiada param → bagi menu default (butang "Cek Kekosongan").
/end
- Tamatkan sesi user.
/stat
- Hantar statistik: total chat, private, group.
/notifythem (admin only)
- Masuk mode broadcast → mesej seterusnya akan dihantar kepada semua user.
/endgroupall
- Clear semua sesi group dari sessions.json.

5. Greeting / Activate

Kalau user taip keyword tertentu:
- mula, husna, /husna → mode exact (jawapan direct ikut keyword penuh).
- hai, salam, hello, carian, /carian → mode contains (lebih fleksibel, keyword mengandungi perkataan).

6. Search Flow (processSearch)

Ambil data dari Google Sheet (tab default Sheet1).
Normalise keywords.
Bandingkan dengan input user:
- Kalau match → kumpul semua row.
- Kalau tak match → reply fallback “tak ada jawapan, sila ke menu/live admin”.
Kalau match:
- Gantikan {firstname} dalam mesej reply.
- Kalau row ada gambar (col 5) → hantar photo message.
- Kalau ada butang (col 3 & 4) → buat inline keyboard.
- Kalau banyak result → tambah butang Ke Menu.

7. Lead Capture Flow (handleLeadCapture)

Step 0: Keyword trigger → bot tanya nak confirm → user perlu /start.
Step 1: Bot minta nama.
Step 2: Bot minta nombor WhatsApp → validate format.
Step 3:
- Simpan ke Google Sheet tab Leads (nama, phone, prefix).
- Hantar mesej “thank you” custom dari sheet Redirect.
- Notify admin dengan mesej + link wasap follow-up.
- Reset sesi lead capture.

8. Callback Query Handling

Kalau callback dari group:
- Kalau bukan admin → suruh user buka DM.
- Tukar channel ke private DM.
- Pastikan session aktif.
Kalau callback dalam DM:
- Cuba handle lead capture dulu.
- Kalau bukan → fallback ke search.

9. Admin Features

Hanya user ID dalam array isAdmin() yang dapat akses:
- /notifythem (broadcast ke semua user).
- /endgroupall.

🔹 Ringkas (High-Level Journey)

User masuk / start → Bot greet / bagi menu.
User tanya keyword → Bot cari dalam Sheet → reply + button/gambar.
Kalau trigger lead → Masuk flow capture data (nama, phone).
Data lead → Save ke Sheet → Notify admin.
Admin boleh broadcast / clear session bila perlu.
Sesi auto tamat kalau idle > 5 minit.

Tuesday, 2 September 2025

Submit RSSa

rssing.com

Monday, 25 August 2025

CARA NAK DAPATKAN TELEGRAM GROUP ID

api.telegram.org/bot<token>/getUpdates

Saturday, 23 August 2025

check laptop performance using powershell

POWERSHELL

get-ciminstance win32_winsat

Friday, 1 August 2025

debug VISUAL STUDIO CODE Error Fetch Extensions

Press Windows + S, search for "Environment Variables", and select:

👉 "Edit the system environment variables"

Click the Environment Variables button at the bottom.

Under User variables for USERNAME(OF YOUR WINDOWS):

Select Path
Click Edit
Click New
Paste the following path:

C:\Users\USERNAME\AppData\Local\Programs\Microsoft VS Code\bin

Click OK on all windows to apply.

Restart Terminal / VS Code

Close Command Prompt, PowerShell, or VS Code, and reopen them.

Now try:

code --version

If the version number appears, it means the code command is now available in the terminal.

Tuesday, 15 July 2025

SEO: Trik Terbaik

Lebih 30 Trik Carian Google untuk SEO GraphicLab

Gunakan kombinasi carian ini untuk:

Mengesan sebutan jenama
Mencari peluang backlink
Menjana idea kandungan
Mengkaji pesaing dalam niche

🔍 Pantau Sebutan Jenama

"graphiclab.my" -site:graphiclab.my

"GraphicLab" -site:graphiclab.my

"graphiclab" -site:graphiclab.my -site:facebook.com

🎯 Kaji Pesaing dan Kandungan Mereka

site:somecompetitor.com

site:somecompetitor.com inurl:blog

site:somecompetitor.com intitle:services

site:somecompetitor.com intitle:pricing

🧲 Cari Peluang Backlink & Outreach

"submit your site" + "web design"

"add your link" + "comic malaysia"

"directory" + "graphic design" + "malaysia"

"guest post" + "branding"

"write for us" + "digital marketing"

"become a contributor" + "creative"

💡 Idea Kandungan Blog / Keyword Research

"how to" + "graphic design"

"why you need" + "a website"

"benefits of" + "brand identity"

"best tools for" + "comic creation"

"top 10" + "web design tips"

📋 Cari Forum, Blog & Komuniti Berkaitan

inurl:forum + "graphic design"

inurl:community + "web design"

inurl:threads + "logo design"

site:quora.com "how to start a comic"

🧱 Cari Blogspot, Wordpress, dan Blog Personal

inurl:.blogspot.com + "web design"

inurl:.wordpress.com + "branding"

inurl:blog + "malaysian comic"

🔧 Operator Advanced (intitle, inurl, intext)

intitle:"graphic design tips"

inurl:portfolio + "branding"

intext:"hire me" + "comic artist"

🕒 Filter Mengikut Tarikh atau Negara

"graphic design malaysia" after:2023-01-01

"buy comic online" site:.my

🎁 Kombinasi Carian Advance

"graphic design malaysia" -site:graphiclab.my inurl:blog after:2023-01-01

intitle:"top comic websites" -site:graphiclab.my inurl:blog

"comic for sale" OR "digital comic" site:.my

intitle:"freelance designer" + "malaysia"

"malaysia comic" -site:graphiclab.my intitle:"top" OR intitle:"best"

📎 Bonus Tip:

Guna Google Tools → Any Time → pilih Past Month untuk lihat hanya kandungan terkini.

"graphiclab.my" -site:graphiclab.my after:2024-01-01

Gunakan carian-carain ini secara konsisten untuk bina senarai peluang backlink, idea kandungan, dan pantauan jenama GraphicLab.

Carian Google untuk Kenal Pesaing GraphicLab

Gunakan carian di bawah dalam browser Google untuk semak siapa yang aktif dalam bidang sama dengan graphiclab.my:

Reka bentuk grafik Malaysia:
```
"graphic design malaysia"
```
Agen web design Malaysia:
```
"web design service malaysia"
```
Freelance comic artist Malaysia:
```
"freelance comic artist malaysia"
```
Branding studio Malaysia:
```
"branding studio malaysia"
```
Studio design Malaysia:
```
"creative design studio malaysia"
```
Website yang serupa dengan GraphicLab:
```
related:graphiclab.my
```

Senarai syarikat terbaik (kita belum masuk?):

"top graphic design companies malaysia" -site:graphiclab.my

Senarai "best comic" tapi bukan kita:

"best malaysian comic" -site:graphiclab.my

Website pesaing tapi blog sahaja:
```
site:cloudeighty.com inurl:blog
```

Web design Malaysia — hanya blog post:

"web design malaysia" inurl:blog -site:graphiclab.my

Salin & tampal carian di atas dalam Google Search untuk lihat siapa pesaing paling hampir, siapa yang rank tinggi, dan jenis kandungan mereka.

Friday, 27 June 2025

Auto select after redirect to the contact page SELECT JAVASCRIPT

https://domain.my/contact/?startup_package=UltimateImpact

<option value="">Startup Package (if any)</option>

<option value="BrandKickstart">Brand Kickstart</option>

<option value="WebsiteSlayer">Website Slayer</option>

<option value="TrafficAssault">Traffic Assault</option>

<option value="UltimateImpact">Ultimate Impact</option>

</select>

document.addEventListener('DOMContentLoaded', function () {

const params = new URLSearchParams(window.location.search);

const selected = params.get('startup_package');

if (selected) {

const select = document.querySelector('select[name="package"]');

if (select) {

select.value = selected;

}

});

</script>

Thursday, 22 May 2025

https://jsfiddle.net/muhazastudio/sxpry723/22/

Hover overlay on card or any image

<//style>

.card {

position: relative;

width: 300px;

height: 200px;

overflow: hidden;

border-radius: 10px;

cursor: pointer;

}

.card img {

width: 100%;

height: 100%;

display: block;

}

.card .overlay {

position: absolute;

top: 10%; /*change position of circle start */

right: 0;

width: 20px;

height: 20px;

background: rgba(0, 0, 0, 0.6);

border-radius: 50%;

transform: translateY(-50%) scale(0);

transition: transform 0.6s ease-in-out;

transform-origin: right center;

z-index: 1;

}

.card:hover .overlay {

transform: translateY(-50%) scale(500); /* Big enough to cover image */

}

<//style>

</div>

example

CSS for next project

https://htmlstream.com