Blog

data:feedLinks
data:olderPageUrl	https://devblogsme.blogspot.com/2013/11/mozilla-firefox-2501.html
data:olderPageTitle	Older Post
data:newerPageUrl	https://devblogsme.blogspot.com/2013/12/google-followers.html
data:newerPageTitle	Newer Post
data:commentLabel	comments
data:authorLabel	Posted by
data:timestampLabel	at
data:postLabelsLabel	Labels:
data:backlinksLabel
data:numPosts	1

data:posts

data:post.dateHeader

Monday, November 18, 2013

data:post.id

7724589776338878835

data:post.title

الآداة السحرية firebug للتعديل على صفحات الإنترنت Online مباشرتاً

data:post.body

السلام عليكم ورحمة الله وبركاته
اليوم معنا آداة من افضل الآدوات التي يمكنك أن تحصل عليها في عالم تطوير الإنترنت, انها الاداة الافضل firebug لتعديل صفحات الانترنت وهي قيد التشغيل !!
كما أن من فوائد الآداة التي تجعل منك مصمم محترم هي انك تقوم بتجربة ما تقوم بعمله قبل ان تطبق هذا على موقعك او مدونتك
كيف ذلك ؟ هو ما سوف نتناوله الان ,, اولاً الآداة تعمل بمنتهى الإحترافية على متصفح FireFox فقط, لذلك يلزمنا متصفح فاير فوكس يمكنك تحميل الاصدار الاخير من ( هنا )
اما عن تركيب الآداة , ادخل هنا على هذا الرابط , وتابع الصور ..

ملاحظة هامة : لرؤية صور الشرح بوضوح إضغط على الصورة مرة واحدة فقط.

بعد الدخول على رابط الآداة ستجد الموقع كهذذا
إضغط على Add to Firefox

ثم انتظر حتى يكتمل التحميل

حتى تأتي هذه النافذة و اضغط Install Now

بعد الضغط على تثبيت الاداة ستجدها هنا بهذا الشكل

ونفترض انك الان فاتح مدونتك او موقع وضغطت على الاداة في هذا المكان في الصورة السابقة

ستجد الاداه هكذا في اسفل الموقع
مقسومة نصفين النصف الاكبر هو كتابة الـ HTML و XML
النصف الاصغر هو كتابه CSS

بقى لنا ان نحدد شئ في المدونة او الموقع و نقوم بالتعديل عليه

انظر لهذا المربع الذي يتخلله سهم صغير, كل شغلنا سيكون من هذا المربع
اضغط عليه وجرب الوقوف على اي شئ في المدونة

انا وقفت على عنوان موضوع انظر ,, تم تحديده بإطار ازرق
اضغط عليه الان وانظر لمكان الاداة

انظر جيداً
1- هو مكان العنوان في صفحة html
2- هو مكان العنوان في صفحة CSS

وبهذا يمكنك التعديل على اي شئ تريد

انظر هنا ,, ضغطت على فونت حتى اعدل على اي شئ اريده
وانفترض انني اريد تكبير الفونت؟؟ سأقوم بتغيير الرقم 18 الى 30 وننظر في الصورة التاليه

تم تكبير العنوان

إذا الآداة لها فائدة آخرى جميلة , وهي رؤية ما تقوم بعمله وهل هو مناسب ام لا قبل التطبيق على قالب المدونة
وإذا أردت تطبيق ما فعلته في المدونة فانظر الصورة التالية

قُم بالضغط على عنوان الكود الذي هو رقم واحد
ثم اضغط عليه كليك يمين وانسخه من كوبي رقم اتنين
وابحث عنه في المدونة وقم بتعديل ما تريد

وبهذه الطريقة تستطيع تعديل اي شئ تريد وكل شئ وكأنك اصبحت من المحترفين

وبهذا ايضاً ينتهي موضوعنا

اترككم في حفظ الله

السلام عليكم

data:post.snippet

السلام عليكم ورحمة الله وبركاته اليوم معنا آداة من افضل الآدوات التي يمكنك أن تحصل عليها في عالم تطوير الإنترنت, انها الاداة الافضل firebug ...

data:post.author

Rafat

data:post.authorAboutMe

data:post.authorProfileUrl

https://www.blogger.com/profile/06073862446924648651

data:post.authorPhoto.url

data:post.url

https://devblogsme.blogspot.com/2013/11/firebug-online.html

data:post.timestamp

3:29 PM

data:post.allowComments

true

data:post.numComments

data:post.embedCommentForm

true

data:post.allowNewComments

true

data:post.commentPagingRequired

false

data:post.showBacklinks

False

data:post.numBacklinks

data:post.addCommentUrl

https://devblogsme.blogspot.com/2013/11/firebug-online.html#comment-form

data:post.emailPostUrl

data:post.editUrl

https://www.blogger.com/post-edit.g?blogID=4342262374491712998&postID=7724589776338878835&from=pencil

data:post.feedLinks

data:post.isFirstPost

true

data:post.isDateStart

true

data:post.includeAd

False

data:post.createLinkLabel

data:post.createLinkUrl

data:post.commentSource

data:post.showThreadedComments

data:post.commentJso

data:post.commentMsgs

data:post.commentConfig

data:post.communityId

data:post.commentHtml

data:post.commentLabelFull

No comments

data:post.noNewCommentsText

data:post.iframeCommentSrc

data:post.addCommentOnclick

data:post.labels

data:label.name	blogger
data:label.url	https://devblogsme.blogspot.com/search/label/blogger
data:label.isLast	False

data:label.name	CSS
data:label.url	https://devblogsme.blogspot.com/search/label/CSS
data:label.isLast	False

data:label.name	HTML
data:label.url	https://devblogsme.blogspot.com/search/label/HTML
data:label.isLast	True

data:post.comments

Header

data:title	Developer my Blog
data:description	Developer My Blog Blogger
data:useImage	true
data:imagePlacement	REPLACE
data:mobile	false
data:sourceUrl	https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7uYZLkLKUs5PSMZKpe50x67DU4iR593_V6GeibF2YJlWGGDVVC9MHW2XZJ0J6gNkEu6SJ-ueI8vVnMmDoWnlWSHDcywcVk6dSZFNV-XMHsrnXwyMBFPoEfboXMk8iueJMwVxpdPwVl3c/s1600-r/magone-logo.png
data:backgroundPositionStyleStr	left
data:height	30px;
data:width	162px;
data:widthStyleStr	width: 162px;

data:blog.title	Developer my Blog
data:blog.pageType	item
data:blog.url	https://devblogsme.blogspot.com/2013/11/firebug-online.html
data:blog.homepageUrl	https://devblogsme.blogspot.com/
data:blog.pageTitle	Developer my Blog: الآداة السحرية firebug للتعديل على صفحات الإنترنت Online مباشرتاً
data:blog.encoding	UTF-8
data:blog.languageDirection	ltr
data:blog.feedLinks
data:blog.enabledCommentProfileImages	true
data:blog.blogId	4342262374491712998
data:blog.metaDescription
data:blog.canonicalHomepageUrl	http://devblogsme.blogspot.com/
data:blog.plusone
data:blog.isMobileRequest	false

Global Data

Blog

data:posts

data:post.labels

data:post.comments

Header