HomeHome  SearchSearch  Rules & Guidelines  Staff List  Latest imagesLatest images  RegisterRegister  Log inLog in  
Announcements

September 13th, 2017: Adding tutorials for the badging community! We're looking for volunteers to feature and help us write guides - PM Panton to get started with our project!


July 3rd, 2017: Canvas Tutorials is currently undergoing a major revamp. Please excuse any hiccups or glitches.


Coming soon

About Us

Canvas creates and supports an IMVU education environment. We offer tutorials and assistance from some of the community's most active and knowledgeable. Tutorials by users, for users!

Staff
Staff Updates
Important Links
Statistics
We have 1428 registered users
The newest registered user is zZbannyezZ

Our users have posted a total of 2569 messages in 157 subjects
Canvas Time

Share
 

 Help with Hyperlinking

View previous topic View next topic Go down 
Pantone

Pantone
Role : Designer & Coder
Location : Indianapolis, IN, USA
http://pantonedoesgraphics.tumblr.com/

Help with Hyperlinking Empty
PostSubject: Help with Hyperlinking Help with Hyperlinking EmptyMon Oct 10, 2016 11:22 am

• Browser Used: Google Chrome, via iMac
• Is this for an order or personal use?: Personal Use


Code:
<center>

<font face="verdana" size="1">

<img src="http://ultraimg.com/images/2016/09/17/gw9k.png" width="900" height=“714” border="0" usemap="#IM1">

<map id="IM1" name="IM1">
<area shape="rect" alt="" title="" coords="829,25,866,156" href="http://www.imvu.com/shop/web_search.php?manufacturers_id=26435999" target="_blank" />
</map>

<div id="main_box" style="width:626px; height:261px; position:absolute; left:206px; top:139px; color: #a1a1a1; z-index:1; overflow:hidden;">
Product Display
</div>

<div id="prod_box" style="width:224px; height:90px; position:absolute; left:25px; top:428px; color: #a1a1a1; z-index:1; overflow:hidden;">
<!-- Product Marquee generated @ gaf210.imvustylez.net -->
<style type="text/css">.imvustylez_products_marquee{margin:0px auto}.imvustylez_products_marquee [id$="_panel_header"] {display: none !important; font-size: 1px} .imvustylez_products_marquee [id$="_panel_body"] {line-height: 1px;} .imvustylez_products_marquee .productbox,.imvustylez_products_marquee .productbox img{width:100px !important;height:80px !important;}</style>
<marquee class='imvustylez_products_marquee' width='218’ height='100' scrollamount='3' direction='left' behavior='scroll' onmouseover="this.stop()" onmouseout="this.start()"><div style='width:1070px'><script type="text/javascript" src="http://gaf210.imvustylez.net/newprodsbanner/filtered_dev_panel.js.php?dev_id=26435999&pn=new&q=10"></script></div></marquee>
</div>

<div id="first_box" style="width:180px; height:114px; position:absolute; left:258px; top:412px; color: #fff; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>GASR QUEUE</H1>
<br><a href=“http://www.gasrforum.com/t37537-pantone-icon-banner-1-spot-available-o-now-building#1847690”/><img src=“http://ultraimg.com/images/StartOrder.png”></a> <a href=“http://www.canvasforums.com/t518-pantone-icon-banner-open-o-open-ended-slots#8053”/><img src=“http://ultraimg.com/images/StartOrder.png”></a>
<br><H2>Icon / Banner</H2><H2>ONE</H2>
</div>

<div id="second_box" style="width:180px; height:114px; position:absolute; left:449px; top:412px; color: #fff; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>CANVAS QUEUE</H1><H2>Icon / Banner</H2><H2>ONE</H2>
</div>

<div id="third_box" style="width:180px; height:114px; position:absolute; left:640px; top:412px; color: #fff; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>UPDATE</H1><H2>10 • 7 • 16</H2><H2> Getting items together and hopefully going to knock out stuff on the weekends, due to work being overly stressful.</H2>
</div>

<div id="fourth_box" style="width:254px; height:187px; position:absolute; left:37px; top:542px; color: #a1a1a1; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>Header</H1><H3>Subheader</H3>
<br>
<center>Normal <b>Bold</b> <i>Italic</i> <u>Underlined</u> <s> Stroked through</s> <h>Highlighted</h> <a href="google.com">Link</a>
<br>
<center><b>Lorem</b> ipsum dolor sit <i>amet</i>, consectetur <u>adipisicing</u> elit, sed do eiusmod <s>tempor</s> incididunt ut labore et dolore <h>magna</h> aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
<br><br>
<H2>Testarea</H2>
<size1>Size1</size1> <size2>Size2</size2> <size3>Size3</size3> <size4>Size4</size4> <size5>Size5</size5> <size6>Size6</size6> <size7>Size7</size7> <size8>Size8</size8>
<br>
<black>Black</black> <White>White</white> <red>Red</red> <pink>Pink</pink> <yellow>Yellow</yellow> <orange>Orange</orange> <sky>Sky Blue</sky> <blue>Blue</blue> <lime>Lime</lime> <violet>Violet</violet>
<br><br>
<blockquote>
Blockquote goes here!
</blockquote>
</div>

<div id="fifth_box" style="width:254px; height:187px; position:absolute; left:301px; top:542px; color: #a1a1a1; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>Header</H1><H3>Subheader</H3>
<br>
<center>Normal <b>Bold</b> <i>Italic</i> <u>Underlined</u> <s> Stroked through</s> <h>Highlighted</h> <a href="google.com">Link</a>
<br>
<center><b>Lorem</b> ipsum dolor sit <i>amet</i>, consectetur <u>adipisicing</u> elit, sed do eiusmod <s>tempor</s> incididunt ut labore et dolore <h>magna</h> aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
<br><br>
<H2>Testarea</H2>
<size1>Size1</size1> <size2>Size2</size2> <size3>Size3</size3> <size4>Size4</size4> <size5>Size5</size5> <size6>Size6</size6> <size7>Size7</size7> <size8>Size8</size8>
<br>
<black>Black</black> <White>White</white> <red>Red</red> <pink>Pink</pink> <yellow>Yellow</yellow> <orange>Orange</orange> <sky>Sky Blue</sky> <blue>Blue</blue> <lime>Lime</lime> <violet>Violet</violet>
<br><br>
<blockquote>
Blockquote goes here!
</blockquote>
</div>

<div id="sixth_box" style="width:268px; height:187px; position:absolute; left:564px; top:542px; color: #a1a1a1; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>Header</H1><H3>Subheader</H3>
<br>
<center>Normal <b>Bold</b> <i>Italic</i> <u>Underlined</u> <s> Stroked through</s> <h>Highlighted</h> <a href="google.com">Link</a>
<br>
<center><b>Lorem</b> ipsum dolor sit <i>amet</i>, consectetur <u>adipisicing</u> elit, sed do eiusmod <s>tempor</s> incididunt ut labore et dolore <h>magna</h> aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
<br><br>
<H2>Testarea</H2>
<size1>Size1</size1> <size2>Size2</size2> <size3>Size3</size3> <size4>Size4</size4> <size5>Size5</size5> <size6>Size6</size6> <size7>Size7</size7> <size8>Size8</size8>
<br>
<black>Black</black> <White>White</white> <red>Red</red> <pink>Pink</pink> <yellow>Yellow</yellow> <orange>Orange</orange> <sky>Sky Blue</sky> <blue>Blue</blue> <lime>Lime</lime> <violet>Violet</violet>
<br><br>
<blockquote>
Blockquote goes here!
</blockquote>
</div>

<div id="avi_box" style="width:160px; height:220px; position:absolute; left:28px; top:139px; z-index:1; overflow:hidden;">
<img src="http://www.imvu.com/catalog/web_av_pic.php?av=Pantone">
</div>

<style type="text/css">
/* S T Y L E S H E E T  M A D E  B Y  K Y A @ I M V U . C O M

  E T O I L E  L A Y O U T S    (C)  A L L  R I G H T S  R E S E R V E D

  D O  N O T  S T E A L,  A L T E R,  R E D I S T R I B U T E  OR  C O P Y    I N  A N Y    W A Y!

  Y O U  H A V E  B E E N  W A R N E D! */

#div {
overflow-x: hidden!important; }

H1 {
margin: 1;
font: normal 17px century gothic;
color: #664287;
border-bottom:1px dashed #664287;
text-transform:normal;
text-align:center;
letter-spacing: 1pt;
line-height: 19px; }

H2 {
margin: 0;
background: #6f39a0;
font: normal 5pt small fonts;
text-transform: uppercase;
text-align: center;
color: #fff;
line-height: 9px; }

H3 {
font: normal 7px verdana;
text-transform:uppercase;   
color: #fff;
letter-spacing: 5px;
word-spacing: 2px;
line-height: 1pt; }

a:link { color: #6f39a0!important; }
a:visited { color: #6f39a0!important; }
a:active { color: #6f39a0!important; }
a:hover { color: #fff!important; background-color:#6f39a0; cursor: crosshair; }
u { color: #6f39a0!important; }
b { color: #6f39a0!important; }
i { color: #6f39a0!important; }
s { color: #6f39a0!important; }
h {line-height: 13px; color: #fff; background-color: #6f39a0; margin: 0px 2px 0px 2px; padding: 0px 3px 0px 3px; }

size1{font: normal 7pt small fonts; }
size2{font-size: 13px; }
size3{font-size: 16px; }
size4{font-size: 19px; }
size5{font-size: 22px; }
size6{font-size: 25px; }
size7{font-size: 28px; }
size8{font-size: 35px; }

Black{color: #000000; }
White{color: #ffffff; }
Red{color: #d40000; }
Pink{color: #ed6199; }
Yellow{color: #f8c333; }
Orange{color: #d46400; }
Sky{color: #00b4d4; }
Blue{color: #18567a; }
Lime{color: #9ad434; }
Violet{color: #7b22a9; }

blockquote{
font-family: Verdana;
text-align: center;
font-size: 10px;
width: 80%;
color: #664287;
background-color: transparent;
border-left:7px double #664287;
border-right:7px double #664287;
padding: 3px; }

:: selection { background-color: #664287; color: #fff; }
::-moz-selection { background-color: #664287; color: #fff; }
::-webkit-selection { background-color: #664287; color: #fff; }

/* S T Y L E S H E E T  M A D E  B Y  K Y A @ I M V U . C O M

  E T O I L E  L A Y O U T S    (C)  A L L  R I G H T S  R E S E R V E D

  D O  N O T  S T E A L,  A L T E R,  R E D I S T R I B U T E  OR  C O P Y    I N  A N Y    W A Y!

  Y O U  H A V E  B E E N  W A R N E D! */
</style>



So the Hyperlinking in the GASR Queue box has these issues:

A) The links will not load, they go to an IMVU 404 Error Page

B) The images will not show up.

Help with Hyperlinking LNzTy2W

@Pantone / @IKumaI / @Valoish / @MARlSS
Back to top Go down
Valoish

Valoish
Role : Designer & Coder
Location : New York City
http://kyaimvu.deviantart.com

Help with Hyperlinking Empty
PostSubject: Re: Help with Hyperlinking Help with Hyperlinking EmptyMon Oct 10, 2016 12:05 pm

@Pantone Fixed c:
Code:
<font face="verdana" size="1">

<img src="http://ultraimg.com/images/2016/09/17/gw9k.png" width="900" height=“714” border="0" usemap="#IM1">

<map id="IM1" name="IM1">
<area shape="rect" alt="" title="" coords="829,25,866,156" href="http://www.imvu.com/shop/web_search.php?manufacturers_id=26435999" target="_blank" />
</map>

<div id="main_box" style="width:626px; height:261px; position:absolute; left:206px; top:139px; color: #a1a1a1; z-index:1; overflow:hidden;">
Product Display
</div>

<div id="prod_box" style="width:224px; height:90px; position:absolute; left:25px; top:428px; color: #a1a1a1; z-index:1; overflow:hidden;">
<!-- Product Marquee generated @ gaf210.imvustylez.net -->
<style type="text/css">.imvustylez_products_marquee{margin:0px auto}.imvustylez_products_marquee [id$="_panel_header"] {display: none !important; font-size: 1px} .imvustylez_products_marquee [id$="_panel_body"] {line-height: 1px;} .imvustylez_products_marquee .productbox,.imvustylez_products_marquee .productbox img{width:100px !important;height:80px !important;}</style>
<marquee class='imvustylez_products_marquee' width='218’ height='100' scrollamount='3' direction='left' behavior='scroll' onmouseover="this.stop()" onmouseout="this.start()"><div style='width:1070px'><script type="text/javascript" src="http://gaf210.imvustylez.net/newprodsbanner/filtered_dev_panel.js.php?dev_id=26435999&pn=new&q=10"></script></div></marquee>
</div>

<div id="first_box" style="width:180px; height:114px; position:absolute; left:258px; top:412px; color: #fff; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>GASR QUEUE</H1>
<br><a href="http://www.gasrforum.com/t37537-pantone-icon-banner-1-spot-available-o-now-building#1847690"/><img src="http://ultraimg.com/images/StartOrder.png"></a> <a href="http://www.canvasforums.com/t518-pantone-icon-banner-open-o-open-ended-slots#8053"/><img src="http://ultraimg.com/images/StartOrder.png"></a>
<br><H2>Icon / Banner</H2><H2>ONE</H2>
</div>

<div id="second_box" style="width:180px; height:114px; position:absolute; left:449px; top:412px; color: #fff; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>CANVAS QUEUE</H1><H2>Icon / Banner</H2><H2>ONE</H2>
</div>

<div id="third_box" style="width:180px; height:114px; position:absolute; left:640px; top:412px; color: #fff; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>UPDATE</H1><H2>10 • 7 • 16</H2><H2> Getting items together and hopefully going to knock out stuff on the weekends, due to work being overly stressful.</H2>
</div>

<div id="fourth_box" style="width:254px; height:187px; position:absolute; left:37px; top:542px; color: #a1a1a1; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>Header</H1><H3>Subheader</H3>
<br>
<center>Normal <b>Bold</b> <i>Italic</i> <u>Underlined</u> <s> Stroked through</s> <h>Highlighted</h> <a href="google.com">Link</a>
<br>
<center><b>Lorem</b> ipsum dolor sit <i>amet</i>, consectetur <u>adipisicing</u> elit, sed do eiusmod <s>tempor</s> incididunt ut labore et dolore <h>magna</h> aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
<br><br>
<H2>Testarea</H2>
<size1>Size1</size1> <size2>Size2</size2> <size3>Size3</size3> <size4>Size4</size4> <size5>Size5</size5> <size6>Size6</size6> <size7>Size7</size7> <size8>Size8</size8>
<br>
<black>Black</black> <White>White</white> <red>Red</red> <pink>Pink</pink> <yellow>Yellow</yellow> <orange>Orange</orange> <sky>Sky Blue</sky> <blue>Blue</blue> <lime>Lime</lime> <violet>Violet</violet>
<br><br>
<blockquote>
Blockquote goes here!
</blockquote>
</div>

<div id="fifth_box" style="width:254px; height:187px; position:absolute; left:301px; top:542px; color: #a1a1a1; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>Header</H1><H3>Subheader</H3>
<br>
<center>Normal <b>Bold</b> <i>Italic</i> <u>Underlined</u> <s> Stroked through</s> <h>Highlighted</h> <a href="google.com">Link</a>
<br>
<center><b>Lorem</b> ipsum dolor sit <i>amet</i>, consectetur <u>adipisicing</u> elit, sed do eiusmod <s>tempor</s> incididunt ut labore et dolore <h>magna</h> aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
<br><br>
<H2>Testarea</H2>
<size1>Size1</size1> <size2>Size2</size2> <size3>Size3</size3> <size4>Size4</size4> <size5>Size5</size5> <size6>Size6</size6> <size7>Size7</size7> <size8>Size8</size8>
<br>
<black>Black</black> <White>White</white> <red>Red</red> <pink>Pink</pink> <yellow>Yellow</yellow> <orange>Orange</orange> <sky>Sky Blue</sky> <blue>Blue</blue> <lime>Lime</lime> <violet>Violet</violet>
<br><br>
<blockquote>
Blockquote goes here!
</blockquote>
</div>

<div id="sixth_box" style="width:268px; height:187px; position:absolute; left:564px; top:542px; color: #a1a1a1; z-index:1; overflow-y: scroll; overflow-x:hidden;">
<H1>Header</H1><H3>Subheader</H3>
<br>
<center>Normal <b>Bold</b> <i>Italic</i> <u>Underlined</u> <s> Stroked through</s> <h>Highlighted</h> <a href="google.com">Link</a>
<br>
<center><b>Lorem</b> ipsum dolor sit <i>amet</i>, consectetur <u>adipisicing</u> elit, sed do eiusmod <s>tempor</s> incididunt ut labore et dolore <h>magna</h> aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
<br><br>
<H2>Testarea</H2>
<size1>Size1</size1> <size2>Size2</size2> <size3>Size3</size3> <size4>Size4</size4> <size5>Size5</size5> <size6>Size6</size6> <size7>Size7</size7> <size8>Size8</size8>
<br>
<black>Black</black> <White>White</white> <red>Red</red> <pink>Pink</pink> <yellow>Yellow</yellow> <orange>Orange</orange> <sky>Sky Blue</sky> <blue>Blue</blue> <lime>Lime</lime> <violet>Violet</violet>
<br><br>
<blockquote>
Blockquote goes here!
</blockquote>
</div>

<div id="avi_box" style="width:160px; height:220px; position:absolute; left:28px; top:139px; z-index:1; overflow:hidden;">
<img src="http://www.imvu.com/catalog/web_av_pic.php?av=Pantone">
</div>

<style type="text/css">
/* S T Y L E S H E E T  M A D E  B Y  K Y A @ I M V U . C O M

  E T O I L E  L A Y O U T S    (C)  A L L  R I G H T S  R E S E R V E D

  D O  N O T  S T E A L,  A L T E R,  R E D I S T R I B U T E  OR  C O P Y    I N  A N Y    W A Y!

  Y O U  H A V E  B E E N  W A R N E D! */

#div {
overflow-x: hidden!important; }

H1 {
margin: 1;
font: normal 17px century gothic;
color: #664287;
border-bottom:1px dashed #664287;
text-transform:normal;
text-align:center;
letter-spacing: 1pt;
line-height: 19px; }

H2 {
margin: 0;
background: #6f39a0;
font: normal 5pt small fonts;
text-transform: uppercase;
text-align: center;
color: #fff;
line-height: 9px; }

H3 {
font: normal 7px verdana;
text-transform:uppercase;    
color: #fff;
letter-spacing: 5px;
word-spacing: 2px;
line-height: 1pt; }

a:link { color: #6f39a0!important; }
a:visited { color: #6f39a0!important; }
a:active { color: #6f39a0!important; }
a:hover { color: #fff!important; background-color:#6f39a0; cursor: crosshair; }
u { color: #6f39a0!important; }
b { color: #6f39a0!important; }
i { color: #6f39a0!important; }
s { color: #6f39a0!important; }
h {line-height: 13px; color: #fff; background-color: #6f39a0; margin: 0px 2px 0px 2px; padding: 0px 3px 0px 3px; }

size1{font: normal 7pt small fonts; }
size2{font-size: 13px; }
size3{font-size: 16px; }
size4{font-size: 19px; }
size5{font-size: 22px; }
size6{font-size: 25px; }
size7{font-size: 28px; }
size8{font-size: 35px; }

Black{color: #000000; }
White{color: #ffffff; }
Red{color: #d40000; }
Pink{color: #ed6199; }
Yellow{color: #f8c333; }
Orange{color: #d46400; }
Sky{color: #00b4d4; }
Blue{color: #18567a; }
Lime{color: #9ad434; }
Violet{color: #7b22a9; }

blockquote{
font-family: Verdana;
text-align: center;
font-size: 10px;
width: 80%;
color: #664287;
background-color: transparent;
border-left:7px double #664287;
border-right:7px double #664287;
padding: 3px; }

:: selection { background-color: #664287; color: #fff; }
::-moz-selection { background-color: #664287; color: #fff; }
::-webkit-selection { background-color: #664287; color: #fff; }

/* S T Y L E S H E E T  M A D E  B Y  K Y A @ I M V U . C O M

  E T O I L E  L A Y O U T S    (C)  A L L  R I G H T S  R E S E R V E D

  D O  N O T  S T E A L,  A L T E R,  R E D I S T R I B U T E  OR  C O P Y    I N  A N Y    W A Y!

  Y O U  H A V E  B E E N  W A R N E D! */
</style>

The problem was the same as last time xD Macs make the quotation marks rounded, which is not the standard quotation mark that are used in coding.
I think the way to work around it is to press Ctrl+Z after making a rounded quote mark to undo the rounded styling that automatically gets applied.

Help with Hyperlinking 70931d3e8ae043a6bd97e4cdd593cb71
Pink one is the standard quote mark, blue is the one from your Mac
Back to top Go down
Pantone

Pantone
Role : Designer & Coder
Location : Indianapolis, IN, USA
http://pantonedoesgraphics.tumblr.com/

Help with Hyperlinking Empty
PostSubject: Re: Help with Hyperlinking Help with Hyperlinking EmptyMon Oct 10, 2016 12:22 pm

UGH okay not getting a Mac when I go to buy.
Like. This quotation shiiiiiiiiiiiiiiiiizz is really annoying. LOL.

Thank you for helping solve this <3 #HBADsolved
Back to top Go down
Sponsored content


Help with Hyperlinking Empty
PostSubject: Re: Help with Hyperlinking Help with Hyperlinking Empty

Back to top Go down
 
Help with Hyperlinking
View previous topic View next topic Back to top 
Page 1 of 1

Permissions in this forum:You cannot reply to topics in this forum
 :: HBAD REALM :: HBAD • Coding :: HBAD • Coding Repair-
Jump to: