All Articles Dreamweaver
إدراج خريطة جوجل الى الدرجة AP في دريمويفر CS5
David Smith on Mon, August 15th 8 comments
Integrating GoogleMaps in to your website is all the rage in the web design world. It's also quite straightforward to do in Dreamweaver. David Smith, Authorised Adobe Trainer, shows you how.

لدينا كل منشأة تستخدم شك جوجل خريطة ممتازة للبحث عن المواقع. لن يكون كبيرا لتكون قادرة على استخدامها لمساعدة الناس على العثور على مواقع لديك أيضا؟ ما هو أكثر من ذلك ، لن يكون أكبر إذا فعل ذلك لم يكن لديهم لمغادرة الراحة من صفحة الويب الخاصة بك؟ انها حقا بسيط جدا القيام به في دريمويفر .


الخطوة 1 -- إعداد الأسس

في Dreamweaver أنا ذاهب لإنشاء صفحة جديدة لهذا : ملف

New Page.

صفحة جديدة.


على الصفحة انا ذاهب الى البدء خلق الدرجة AP عقد خريطتي في الصفحة. تأكد أولا من أن يتم تعيين وجهة نظركم الصفحة إلى مصمم بحيث يمكنك الاطلاع على صفحة الفعلية.

Design View Button.

عرض تصميم زر.


من لوحة إدخال المشتركة ، مثلما تختار الفئة وحدد "رسم AP الدرجة".

Draw AP Div button.

رسم زر AP الدرجة.


سوف يظهر المؤشر الآن في التقاطع ، مع التقاطع رسم مربع في مكان ما على الصفحة. في محاولة لجعله حجم كنت ترغب في رؤية الخريطة المعروضة. يمكن أنب لاحقا.

AP Element on screen.

AP العنصر على الشاشة.


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

في لوحة وسوف يتم عرض خصائص خصائص في الدرجة. تغيير معرف إلى "MapBox' وتعيين W

Properties Panel.

خصائص لوحة.


الخطوة 2 -- ادراج خريطة

استخدام مستعرض الويب الخاص بك للبحث عن موقع باستخدام خرائط جوجل. لقد فتشت خارج مكتب التدريب يمكنني استخدامها في غلاسكو.

Glasgow Google Map.

غلاسكو خريطة جوجل.


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

Goole map link button.

خريطة جوجل زر الارتباط.


حدد كافة التعليمات البرمجية داخل مربع وضع علامة "لصق HTML لتضمينها في موقع" ونسخه.

تلميح : انقر فوق 3 مرات في تتابع سريع على رمز لتحديد كل شيء ، ثم نسخ (القيادة - C) للتأكد من أنك لا تفوت أي.

Google Map Insert Code.

مدونة جوجل خريطة إدراج.


وهذا الرمز تمكين إعادة عرض هذه الصفحة مع خريطة جوجل التفاعلية بالكامل لموقعك داخل الدرجة AP باستخدام iframe (إدراج الإطار).

لادخال هذه الشفرة في الدرجة AP MapBox دينا في Dreamweaver ، ولصقه في عرض التعليمات البرمجية بين

نصيحة : إن أسهل طريقة للتأكد من أن يتم إدراج رمز في الموقع الصحيح للتبديل إلى طريقة عرض التصميم وانقر داخل الدرجة AP MapBox على الصفحة بحيث مؤشر وامض يجلس داخل

Code View Cursor.

رمز عرض المؤشر.


التحول إلى انقسام عرض لرؤية كل من تصميم ورمز. وسوف يكون المؤشر الآن تومض بين العلامات الصحيحة DIV المفتوحة والمغلقة ، ويمكنك لصق رمز (القيادة - V).


الخطوة 3 -- معاينة

والتبديل على عرض لايف في Dreamweaver والخريطة التفاعلية تظهر على الصفحة الخاصة بك داخل الدرجة MapBox.

Map Page.

صفحة الخريطة.


يمكنك دائما استخدام لوحة خصائص لتغيير حجم الدرجة MapBox إذا لزم الأمر ، فقط للتأكد من التبديل إيقاف العرض الحي لتمكين المعلمات.

إذا كنت يتوهم التحدي الأصعب ثم يمكنك أيضا استخدام أوراق الأنماط المتتالية (CSS) لتنسيق MapBox مع الحدود ، والخلفيات وما إلى ذلك ، ولكن هذا لمقال آخر.


Learn more about Dreamweaver here.


Comments (8)

You must be logged in to comment.

  • Dennis
    Thank you so much. I have bookmarked your page for future reference. Valuable info!
    • 5 years ago
    • By: Dennis
    Reply
  • Skye
    For non Dreamweaver users, just a note that an AP Div is just a div with absolute positioning (AP). If you look at the source code image you can see the absolute positioning style that Dreamweaver has applied to the div.
    • 7 years ago
    • By: Skye
    Reply
  • David Smith
    You are absolutely right Skye, thank-you
    • 7 years ago
    • By: David Smith
    Reply
  • Dear author, I want to express my sincere thanks of this useful article.
    • 6 years ago
    • By:
    Reply
  • David Smith
    Thank-you
    • 6 years ago
    • By: David Smith
    Reply
  • elisabetta
    grazie
    • 6 years ago
    • By: elisabetta
    Reply
  • David Smith
    Prego
    • 6 years ago
    • By: David Smith
  • Sandra
    Hello there, I need some help. I want to create a structure with 4 frames: Left, Top, Main and Right. In the top frame I have a Banner, in a table, and I want to insert a Spry Menu Bar. The problem is, if I want in that Spry a Vertical Menu it doesn't shows up in the main frame. How do I make it visible? Best regards.
    • 5 years ago
    • By: Sandra
    Reply
Feedback
Course Advisor
Don't Know Where To Start?
Ask A Course Advisor
Ask Us!
Copy the link below and paste it into an email, forum, or Facebook to share this with your friends.
Make money when you share our links
Become a macProVideo.com Affiliate!
The current affiliate rate is: 50%
Classes Start Next Week!
Live 8-week Online Certification Classes for: