이번글에서는 HOME 페이지에 플래시 로고와 컨텐트 영역에 유투브 동영상 삽입하는 방법을 알아봅니다. 이전글에서 구글맵을 삽입할때 알아봤듯이 모든 요소의 삽입은 위치배정에 있어서 아주 자유롭습니다. 이것을 CSS로 배치하자면 단순하지가 않습니다. 하지만 뮤즈에서는 클릭드래그해서 원하는 곳에 놓기만 하면 스타일을 자동으로 만들어주는 것입니다. 1. 플래시 로고 삽입하기 플랜뷰 모드에서 A-Master 썸네일을 우클릭해서 페이지 복사를 선택하면 매스터페이지가 복사됩니다. 이름을 바꾸고 더블클릭해서 디자인뷰에 불러옵니다. 1의 로고이미지를 선택해서 Delete키를 눌러 삭제하고 Ctrl+D키를 눌러 브라우저창에서 Logo.swf파일을 선택해서 엽니다. 3의 페이지 상단 조절 슬라이더를 이동해서 공간을 만든 다..
이번글에서는 구글맵을 삽입하는 방법을 알아봅니다. 플랜뷰에서 KART MAP 페이지를 더블클릭해서 디자인뷰로 불러옵니다. 텍스트툴을 선택하고 클릭드래그하여 텍스트 프레임을 만든 다음 글자를 입력합니다. 선택툴을 선택하고 글자를 선택한 다음 패러그래프 스타일에서 Georgia Body Medium을 선택합니다. 구글맵 으로 이동하여 검색창에 Adobe SF를 입력, 엔터키를 치면 지도가 나옵니다. 1의 링크 아이콘을 클릭하고 2의 코드를 클릭한 다음 3의 링크를 클릭합니다. 지도 사이즈를 선택하거나 2에서 원하는 사이즈를 입력하고 엔터치면 코드가 나옵니다. 트리플클릭 하면 블럭설정이 되고 Ctrl+C를 눌러 복사합니다. Ctrl+V키를 누르거나 메뉴에서 Object-Insert HTML 을 선택하면 창이 ..
툴팁은 이미지나 글자에 마우스를 올리면 추가설명 글이나 링크가 나오게 하는 효과입니다. 일명 말풍선이라고도 합니다. 뮤즈를 사용하면 간단하게 툴팁을 설치할 수 있습니다. 마스터페이지를 열고 위젯 라이브러리 패널에서 컴퍼지션을 연다음 툴팁을 선택하여 클릭드래그해서 페이지에 올립니다. 썸네일을 느리게 더블클릭하여 선택된 다음 Delete키를 눌러 제거합니다. 두번째도 제거하면 두개의 썸네일과 툴팁이 제거됩니다. 썸네일을 선택하고 모서리의 조절점을 클릭드래그하여 가로세로 37픽셀로 만들어줍니다. 툴팁은 썸네일 위로 이동하고 3의 코너를 클릭하여 둥글게 한 다음 반지름을 20으로 줄입니다. 텍스트 툴을 선택하여 이름을 Facebook으로 고쳐줍니다. 썸네일의 우측에 있는 플러스 아이콘을 클릭하면 같은 크기의 썸..
이전 글에서 빠트린 글 안에 이미지를 삽입하여 글이 이미지를 감싸는 텍스트랩(Text Wrap)기능과 여러개의 이미지를 이용하여 웹 갤러리를 만드는 방법을 알아봅니다. 1. 이미지 삽입하여 글로 감싸기 Ctrl+D키를 눌러서 저장 폴더의 slideshows 폴더에서 커피 열매 사진을 불러옵니다. 사진이 커서 사이즈를 줄여야합니다. 위젯안에 클릭하면 수정하기 어려우니 밖에 클릭한 다음 조절점을 클릭드래그하여 축소해줍니다. 포토샵처럼 Shift키를 누르지 않아도 가로세로 비율을 유지한채 축소됩니다. 이미지 크기를 줄인 다음 Ctrl+X키를 누르면 클립보드에 저장됩니다. 텍스트툴을 선택하고 글자의 앞에 클릭하면 커서가 깜박거릴때 Ctrl+V키를 누르면 이미지가 삽입됩니다. Wrap패널을 열고 두번째 아이콘을 ..
이전 글에 이어서 어도비 뮤즈 베타의 메뉴바에 서브메뉴를 추가하는 방법과 본문에 글을 추가하고 본문의 내용을 어코디언을 사용해서 글의 내용을 보이게 하거나 안보이게 하는 방법을 알아봅니다. 어도비 뮤즈 베타의 플랜뷰에서 두번째 썸네일을 선택하고 2의 아이콘을 클릭하면 서브 페이지가 만들어집니다. 서브페이지에서 우측 플러스 아이콘을 클릭하면 새페이지가 만들어집니다. 이름을 더블클릭하여 Preparation과 Origin으로 입력한 다음 A-Master 썸네일을 더블클릭합니다. 우선 이전글에서 빠트린 부분을 보완합니다. THE KOFFEE 부분을 선택합니다. 여러개의 요소가 있는 부분에서 한 부분을 선택하려면 다른 빈 공간을 클릭하여 해당부분이 전혀 선택이 안된 상태에서 한번 클릭하고 2초 정도 기다렸다가 ..
어도비 뮤즈 베타의 장점은 몇번의 클릭만으로 이미지에 그림자를 만들 수 있고 포토샵 PSD 파일을 지원하여 레이어형태의 이미지를 삽입할 수 있습니다. 또한 도형에 베벨효과와 글로우 효과 등 포토샵에서 사용되는 레이어스타일 효과를 줄 수도 있습니다. 사각형의 모서리를 둥글게 할 수도 있는데 이러한 효과는 CSS3에서만 가능하여 코딩을 하자면 한참 걸립니다. CSS3는 일부 브라우저는 지원하지 않기 때문에 현재로서는 사용하기 어렵지만 어도비 뮤즈 베타로 작업하면 인터넷익스플로러 7버전까지 지원하게 됩니다. IE는 웹개발자들에겐 참 난감한 브라우저입니다. 다른 브라우저는 다 지원하는데 유독 IE만 지원하지 않는 것이 많습니다. 그것을 가능하게 할 수 있는 것이 어도비 뮤즈 베타입니다. 이번 글에서는 이러한 효..
이전 글 에서 어도비 뮤즈 베타의 작업흐름을 알아보았는데 이번글에서는 프로젝트파일인 뉴사이트만들기와 헤더(Header)영역 푸터(Footer)영역 설정하는 방법, 이미지 삽입하는 방법을 알아봅니다. 어도비 뮤즈 베타 초기화면의 웰컴스크린에서 뉴사이트버튼을 클릭하거나 메뉴에서 파일-뉴사이트를 선택하면 위와 같은 창이 나옵니다. 페이지의 넓이와 높이를 입력하고 컬럼 수를 3, 컬럼의 넓이는 273, 컬럼간의 간격인 거터는 20을 입력합니다. 마진은 3의 체인아이콘을 클릭하고 50을 입력하면 4곳에 동일한 수치로 입력됩니다. 패딩은 상하 36을 입력합니다. 입력도중에 수치가 변경되는 수가 있는데 이는 위 내용을 보면 가로 사이즈가 960인데 2번항목의 수치를 다 더하게 되면 959가 나오게 됩니다. 그래서 자..
어도비에서 현재 개발중인 뮤즈(코드네임) 베타가 현재 4 버전까지 나왔습니다. 정식버전은 내년에 나올 예정이고 현재는 정식버전이 나올때까지 무료로 사용이 가능합니다. 정식으로 나오게 되면 구독(Subscription)형태로 한달에 15불씩 사용료를 지불하게 됩니다. 또한 프로그램이름도 구상중이라서 바뀌게될 예정입니다. 현재 어도비 뮤즈 베타의 튜토리얼이 많지 않지만 어도비 사이트에서 기본적인 강좌와 린다닷컴의 프리뷰 강좌를 참고하여 기능을 살펴보고 있는 중인데 그야말로 코딩이 전혀 필요없고 자료폴더(Assets)에서 붙여넣기만 하면 금방 여러개의 웹페이지가 만들어집니다. 그렇다고 단순한 웹페이지가 아니고 제이쿼리를 이용한 애니메이션, 슬라이드쇼 등도 가능한 페이지가 됩니다. 여러개의 글을 통해 기본부터 ..