فایر باگ و notepad ++

[yazdi 0]

سلام

من باافزونه فایر باگ میتونم کدهای مورد نظر را پیدا کنم و تغییر ظاهری بدهم

ولی برای تغییر واقعی در هاست آدرس کدهای مربوطه را نمیتوانم پیدا کنم

مثلا میخام عدد 91 رو تغییر بدم نمیدونم مسیرش در هاست کجاست ؟

کمک های فایز باگ :

copy html

copy innerhtml

copy xpath

copy css path

رو وقتی به محل مراجعه میکنم عدد 91 وجود نداره

حتی با notepad ++ تو کل پوشه قالب سرچ کردم عدد 91 رو نمیتونه پیدا کنه

لطفا دوستان منرو راهنمایی کنند تا بتونم با فایر باگ و notepad ++ هر تغییری بخوام تو قالب ها بدم

با تشکر

[مصطفی صفرعلی 2,891]

با سلام

با استفاده از کلید F12 میتوانید پنجره فایرباگ را باز کنید یا ببندید . بعد از زدن کلید F12 از ابزارهای فایرباگ علامت اشاره گر ماوس را انتخاب کنید سپس آیتمی را که میخواهید کدهای آن را ببینید روش کلیک کنید در پنجره سمت راست فایرباگ کدهای CSS به شما نشان داده خواهد شد . برای هر قسمت از کدها نام فایل CSS به همراه شماره خطی که کد مربوطه در آن واقع شده نشان داده میشود . اما برای آنکه محل فایل را پیدا کنید فقط کافیست تا اشاره گر ماوس خود را روی نام فایل مربوطه قرار بدید تا در کادر Tooltip که کنار اشاره گر ماوس ظاهر میشود مسیر فایل به شما نشان داده شود . بعد از یافتن مسیر میتوانید با ++Notpad (توصیه میشود) یا هر ویرایشگر متنی دیگر به محل فایل مربوطه رفته و فایل را ویرایش کنید

موفق و پیروز باشید

یا حق

:64 (17):

[yazdi 0]

با تشکز از شما

من تا اینجاش رو آمدم

فقط مشکل همینجاست (البته رشتم برقه و زیاد css و html نمیدونم)

یعنی مثلا میخوام عرض منوی اصلی قالب جوملارت رو زیاد کنم . میده 55

در copy css path اینو میده

html body#bd.fs3 div#ja-wrapper div#ja-mainnav.wrap div.main div.mid div.main-inner

و در سمت چپ هم مسیر html اینو میده

و ..............

حالا من دقیقا چه عبارتی رو در ++Notpad جستجو کنم . حتی 55px رو در کل شاخه قالب و حتی کل شاخه سایت با ++Notpad سرچ میکنم هیچ نتیجه ای پیدا نمیشه

[مصطفی صفرعلی 2,891]

با سلام

در این پست آموزشی رو براتون تهیه کردم تا کمی با css آشنا بشید . برای مثال تمرین روی سایت www.idevcenter.com رو براتون آموزش میدم

فرض کنید در این سایت قصد داریم تا منوی بالای سایت را طول و عرضش رو تغییر بدیم

(در صورتی که تصاویر را واضح نمیبینید روی عکسها کلیک کنید)

1 – انتخاب کننده شی

2 – شی مورد نظر را انتخاب میکنیم در اینجا میخواهیم منوی بالای سایت را انتخاب کنیم

3 – نام کلاس سی اس اس شی موردنظر را نشان میدهد

4 – خصوصیات کلاس موردنظر را نشان میدهد

5 و 6 - مقدارهای این دو مورد را از 5px به 20px تغییر میدهیم (برای تنظیم ارتفاع جدید)

نکته : میتونستم به جای تغییر padding ها از تغییر مقدار کد height استفاده کنم ولی تغییر در کد height باعث میشه تا برای تراز کردن متن منو هم کدی را تغییر بدیم به خاطر همین من راه کوتاه تر رو انتخاب کردم

7 – برای تنظیم عرض از کد width استفاده میشود از آنجایی که این کد در کلاس قرار نداشت خودم آن را اضافه کردم و جواب هم داد . گاهی اوقات اضافه کردن کد تغییری رو ایجاد نمیکنه که اینجور مواقع باید دنبال کد اصلی در کلاس دیگری گشت

8 – مشکل شما در این قسمته که مسیر رو از اینجا میتونید پیدا کنید . برای این کار کافیست تا فقط اشاره گر ماوس تون رو روی لینک نام فایل سی اس اس مورد نظر ببرید تا کادر مسیر فایل سی اس اس ظاهر بشه . در این مثال نام فایل سی اس اس main.css و کلاس موردنظر در خط 546 قرار گرفته است و مسیر آن هم در روت هاست در پوشه stylesheets قرار گرفته است

برای اضافه کردن کد (در فایر باگ) کافیست تا مقدار آخرین عبارت کلاس مورد نظر را انتخاب کنید و بعد اینتر را بزنید تا یک خط جدید برای شما ایجاد شود سپس ابتدا عبارت مورد نظر را بنویسید و اینتر را بزنید و بعد مقدار آن را مشخص کنید

9 – برای مشاهده سایر فایلهای سی اس اس ابتدا به این سربرگ میرویم

10 – در اینجا لیست فایلهای سی اس اس بکار رفته در سایت به همراه مسیرشان مشاهده میشوند

11 – این دایره زمانی نشان داده میشود که ماوس تون رو کنار کد میبرید با کلیک بر روی آن میتوان کدی را غیر فعال کرد و یا دوباره آن را فعال کرد . به عنوان مثال با غیر فعال کردن کد font-size: 0.7em; فونتها کمی بزرگتر میشوند

شما در فایرباگ هرگونه تغییری رو میتونید ایجاد کنید بدون اینکه دخل و تصرفی در فایلهای اصلی داشته باشید چون تمام این تغییرات در حالت مجازی انجام میشه . بعد از اینکه تغییرات مورد نظرتون رو انجام دادید و همون چیزی بود که شما میخواستید حالا باید همون تغییرات رو با ++Notpad در فایل اصلی وارد کنید . منظورم از فایل اصلی ، فایلیست که در فایرباگ نام آن به شما نشان داده شده است همون مورد هشتم

مطالب گفته شده در بالا بیشتر برای نحوه آشنایی با ابزارها و طرز کار فایرباگ بود . با تمرین کردن روی چند سایت مختلف براحتی با کدهای مختلف و نحوه عملکردشون میتونید آشنا بشید

در صورتی که باز هم نتونستید مشکل رو حل کنید باید دمو آنلاین بدید تا بتونیم کمکتون کنیم

موفق و پیروز باشید

یا حق

:64 (17):