X Course Advisor FREE Course Advisor
(Close)
Watch Tutorials
macProVideo.com
Close

무료 프리미엄 액세스

프리미엄 허브 기사, 프로젝트 파일 및 각 튜토리얼 비디오의 첫 번째 10 %의 우리의 전체 라이브러리를 액세스 온라인 자습서 도서관 .

지금 무료 계정을 만드십시오!

드림위버 CS5에서 AP 사업부에 구글지도를 삽입
Google 번역에 의해 번역

우리는 의심의 여지가 위치를 검색하는 구글의 우수한지도 시설을 이용 없어요. 그것도 사람들이 당신의 위치를​​ 쉽게 찾을 수 있도록 그들을 사용할 수 있도록 훌륭한하지 않을까요? 그들이 당신의 웹 페이지의 편의를 떠날 필요가 없다고했던 할 수있다면 더 무엇, 그것은 더욱 안 그러 겠어요? 정말에서 할 수있는 매우 간단 드림위버 .


1 단계 - 기초 준비

드림위버에서이에 대한 새 페이지를 만들거다 : 파일

New Page.

새 페이지.


페이지에서 그 페이지에 내지도를 잡아 AP 사업부를 만들어 시작하는거야. 먼저 실제 페이지를 볼 수 있도록 페이지보기가 디자이너로 설정되어 있는지 확인합니다.

Design View Button.

디자인보기 단추.


삽입 패널에서 카테고리로 일반을 선택하고 'AP 사업부를 그려'를 선택하십시오.

Draw AP Div button.

AP 사업부 버튼을 그립니다.


당신 커서 이제 십자선 모양의이 아이콘이 표시됩니다, 십자선 모양으로 페이지에 어딘가에 상자를 그립니다. 그것 당신이지도 표시보고 싶은 크기하기 위해보십시오. 그것은 나중에 조정하실 수 있습니다.

AP Element on screen.

화면에서 AP 요소입니다.


이 상자는지도를 포함됩니다. 제가지도이 상자를 만든 이유는 내가 그것을 수정할 수있는 용이입니다. 상자의 왼쪽 상단 모서리에있는 작은 흰색 사각형을 잡아 것은 나를 어디 상자를 재조 정할 수 있습니다.

속성 패널에서 사업부의 속성이 표시됩니다. 'MapBox'로 ID를 변경하고 W 설정

Properties Panel.

속성 패널.


2 단계 -지도를 삽입

Google지도를 사용하여 위치를 검색하는 웹 브라우저를 사용하십시오. 나는 글래스 고에서 사용하는 교육 사무실을 검색했습니다.

Glasgow Google Map.

글래스고 Google지도.


구글지도에서 오른쪽 상단 모서리에 약간의 작은 아이콘이 있습니다. 하나라는 링크를 클릭하면 열어 것입니다.

Goole map link button.

Google지도 링크 버튼을 클릭합니다.


그것을 복사하여 "웹사이트에 포함할 HTML 붙여넣기"이라고 표시된 상자 안에 모든 코드를 선택합니다.

팁 : 모두 선택하기 위해 코드에 신속하게 연속적으로 3 번 클릭한 다음 복사 (명령 - C)이 어떤 놓치지 않도록합니다.

Google Map Insert Code.

Google지도 삽입 코드입니다.


이 코드는 활성화됩니다 다시 표시 IFRAME (삽입 프레임)를 사용하여 AP 사업부 안에 위치의 완전 대화형 Google지도와이 페이지의.

드림위버에서 우리 AP 사업부의 MapBox에이 코드를 삽입하기 위해서, 사이의 코드보기에 붙여 넣으십시오

팁 :이 코드는 올바른 위치에 삽입되었는지 확인하는 가장 쉬운 방법은 깜박이는 커서가 내부 앉아 있도록보기를 디자인하고 페이지에서 MapBox AP 사업부 내부를 클릭하십시오로 전환하는 것입니다

Code View Cursor.

코드보기 커서.


디자인과 코드를 모두 볼 수보기를 분할로 전환합니다. 커서가 이제 올바른 열고 닫힌 사업부 태그 사이 점멸되며 (명령 V) 코드를 붙여넣을 수 있습니다.


3 단계 - 미리보기

드림위버와 쌍방향지도에서 라이브보기를 전환하여 MapBox 사업부 내부의 페이지에 표시됩니다.

Map Page.

지도 페이지.


당신은 항상 당신이 매개 변수를 사용하는 라이브보기를 전환 있는지, 필요한 경우 MapBox 사업부 크기를 조정할 수있는 속성 패널을 사용할 수 있습니다.

당신이 더 도전을 공상면 당신은 또한 테두리, 배경 등 MapBox 형식을 CSS 스타일 시트 (CSS)를 사용할 수 있지만, 다른 기사에 대한이야.


Learn more about Dreamweaver here.


David Smith

David Smith | Articles by this author

David Smith is Scotland's most qualified Apple and Adobe certified trainer. Having completed his education at Edinburgh College of Art's BAFTA winning Film School, David moved straight into TV production, first as a Vision Mixer then quickly becoming, at the age of just 24, a director of live TV studio productions. In 2001 he moved into Higher Education where he became a lecturer in TV Production, specializing in post-production and live studio production. During this time, and working with the support of the BBC, Channel 4 and independent production companies, David was instrumental in the design, development and implementation of industry-approved vocational courses across Scotland's Colleges. In 2006, after working closely with Apple Computers to create a unique multimedia studio for education at the Music and Media Centre in Perth, David became Scotland's first Apple-Certified Trainer for Pro Apps. This led on to David forming the first Apple Authorized Training Centre for Education, north of Manchester. In 2008 David made the move to full time training and joined the ranks at Academy Class, Ltd. where he continues to train industry professionals as a certified trainer across the Adobe Creative Suite and Apple Pro Apps range.

Comments

Aug 15, 2011
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.
Sep 02, 2011
David Smith
You are absolutely right Skye, thank-you
Aug 08, 2012
Dear author,

I want to express my sincere thanks of this useful article.
Aug 27, 2012
David Smith
Thank-you
Apr 04, 2013
elisabetta
grazie
Apr 05, 2013
David Smith
Prego
Jun 18, 2013
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.
Aug 15, 2013
Dennis
Thank you so much. I have bookmarked your page for future reference. Valuable info!
You must be logged in to post a comment.
Create an Account  Login Now

What is macProVideo.com?

macProVideo.com is an online education community featuring Tutorial-Videos & Training for popular Audio & Video Applications including Adobe CS, Logic Studio, Final Cut Studio, and more.
© 2018 macProVideo.com
a division of NonLinear Educating Inc.
Link