I'm new to creating extensions and I also don't know much about html but I have an idea for a chrome extension that should be pretty simple so if you give me a little help I may be able to do it.
I want a popup to open when the user clicks the extension-icon (like most extensions) and the popup is supposed to contain a webpage like "http://google.com". That's actually about it. I created the manifest file with the required data and thats fine, now I need to know how to make the html file contain the external webpage.
Another problem: when I tried different things in the html file the popup was tiny and just white.
I hope someone can give me hint. Thanks!
I have made an extension wich displays links to several websites.
My popup.html looks like this:
<!DOCTYPE html>
<html>
<body>
<p>
<a href="http://www.google.com" target="_blank>Google</a> <br/>
<a href="http://stackoverflow.com" target="_blank>StackOverflow</a> <br/>
</p>
</body>
</html>
The target="blank means it opens the site in a new tab
More information about html is found here:
http://www.w3schools.com/html/html_links.asp
Be sure to make the icon 19x19 pixels,and be sure to name it in the manifest.json file
with the filename extension for example
"browser_action":{
"default_icon":"iconname.png",
"default_popup":"popup.html"
}
You should be able to use an iframe tag within your popup. I do that many times to point the user a FAQ page hosted outside.
Related
I have created a sort of table of content in html that link to specific page into pdf using #page=n and it works fine if i have 1 link for 1 pdf.
The problem comes when i have multiple link to the same pdf.
ie:
href="001.pdf#page=10"
href="001.pdf#page=20"
href="001.pdf#page=30"
The first time it works fine and open the pdf at the right page, then if i use others link with the pdf opne, the page didn't change.
There is a workaround for this?
Thanks for the first answer. You right, i've forgot some informations.
The final output have to be cross-browsers.
This is my test code with random online pdf:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
link 001
link 002
link 003
link 004
link 005
<iframe style="height:800px; width:800px;" name="PDFcontent" src="http://www.naplesip.com/wp-content/uploads/2015/10/pdf-logo.png"></iframe>
</body>
</html>
I've tried to used it on jsfiddle but does not work. Instead it work on browsers (firefox/chrome/edge/ie).
There is not much background information about how you are opening the PDF, what browser you are using, and how you use the other links. I will answer as well as I can in a general way.
Opening PDFs into a desktop program might accept your page anchor tag and jump to the requested page upon opening a PDF, but opening the same document again (while it is still open) will result in the system simply switching your active application to the one with the PDF open.
If you first close the document, then open another page, I suspect it would work, unless settings in your PDF reader are remembering the previous page.
This behaviour is something you have little control over on your own computer, and no control over on anyone else's so you might have to come up with an alternative.
so I have a web page I've been working on that uses embedded Google Docs in an iFrame to keep it updated without having to hard code notices/updates.
I came across a problem, where if you were to click on a link it opens in the iframe instead of opening in a new tab, which is preferable. I've tried things like:
<base target="_blank" />
Any ideas on how to accomplish this? (Note that with Google docs I can't find a way to change the way links are handled, so I'd need to do that on the end of the main page.)
Website source:http://www.salefee.com/blog/
The above website is made on wordpress.In this I have an html code which looks like: <div class="image-title-bg loading" style="padding-top: 140px;">(found out using inspect element option in chrome)
I want to change the padding-top: to 50px,But I am not able to find it in admin panel. Basically I am trying to reduce the image size on my first page of blog. Please help me out with this problem. Thanks in advance!!
You probably will enjoy this WordPress plugin : Simple Custom CSS
;)
You will have to find the relevant file and make changes in it.
Tip: You can search that html tag line in php files.
To change html in Wordpress in admin part you should get to source of home page which can be usually found in Appearance Editor tab. Over there you can find php and html which you can edit. Or if you have FTP access you can track file there.
I was thinking about getting started creating my own website with weebly.com. If I eventually want to move my website to a different host is there a way to do that? When I edit the html code it seems like weebly doesn't show you the whole code that's being used.
For example I just see:
<div id="main"><div class="container">{content}</div></div>
Instead of the <img src> or <p> that are actually on my page?
Is there any way I can see the full code or should I choose a different editor?
In your site editor, make sure you're on the SETTINGS tab, select GENERAL, scroll down, select ARCHIVE. Enter your email address and click EMAIL ARCHIVE. A link to download your zipped archive file will be mailed to you.
Trying a very basic link through HTML to internet:
<p>Google</p>
No matter what website I try to link to my browser says ERR_FILE_NOT_FOUND and the detail
No webpage was found for the web address: file:///Users/stevemcc101/Dropbox/html/“https://www.google.comâ€
So my browser is always picking up the path to the dropbox folder (or any other folder I save the document in) and not linking direct to the URL.
Sorry I know a basic query but just starting to learn HTML and can't get around this issue. Please help!
Try without the quotes like so:
<p><a href=http://www.google.com>Google</a></p>
if that works then the issue is with your quotes