I have a pptx file, complete with working links which i would now like to convert to html. The idea really is to convert the pptx file into a website.
I am using Power Point 2010. I got some tips on how to do this conversion
# http://support.microsoft.com/kb/980553 and a tool which does exactly the same thing
# http://www.ultrashareware.com/Ultra-PPT-To-HTML-Converter.htm
I am able to get an html version,but the links do not work. Navigation is only possible by clicking the slide number created on the left pane of the created html frame.
My questions
1. How do i get the links on the html page to work as they did in the pptx
2. The main page is divided into 2 frames, the left showing the slide numbers. How do i get rid of the left frame entirely?
Thank you
Sameer
If you're interested in writing it yourself, it's a fairly substantial undertaking. The most direct method is to export an image of each slide and put that into the resulting HTML with an IMG tag. You'd also need to construct an image map and include in it each of the hyperlink URLs from the slide, along with coordinates normalized from PPT's slide size to the size of the image you're adding to the HTML. Or work out how to put links in DIVs atop the image.
If you're looking for an immediately available commercial add-in that gives you more control over the appearance of the HTML, I've written one. There's more info and a free demo at http://www.pptools.com/ppt2html/
I'd be happy to answer any questions you have about it, but it might be best not to clutter SO with support chat. There's a Contact link on each page of the pptools site; best to use that to get in touch, if you wish.
Related
I have a program that let's people design web pages graphically. Then hitting Publish creates an html file that is supposed to be an exact copy of what they created. The elements created by the editor are HTML elements. Publish then gathers up all the elements that have been created and for each one adds it to a string with
canvasOuterHTML += clone$[0].outerHTML;
So all the styles, text, etc., get put on the string. This string, along with some other information is written to the .html version of the page, and when this .html is loaded into a browser the browser displays the page!
But something is expanding the published page vertically. I've created the simple page below to illustrate. The first image is the page in the editor. The second image is what the html displays in the browser.
I'm completely stumped because the HTML and CSS for the two markups is exactly the same, so how can one be higher? I can't even think of a mechanism that would do that. Does anyone have any ideas? Thanks.
Is there source code (or a browser plugin) to convert the contents of an HTML 5 web page to an image file? This would not just include the visible contents, but the hidden contents as well (assuming there were scroll bars in the page). If there isn't, any advice on how to approach this particular functionality would be appreciated, and I can look into it.
I found this...
html to jpg with c#
However...
I think they just had text in the page, so it doesn't have any dynamic images on the page. My page specifically uses the HTML 5 canvas functionality to draw images. So that must be part of the image file.
It looks like you should be able to do it using javascript with this technique:
http://www.html5canvastutorials.com/advanced/html5-canvas-save-drawing-as-an-image/
Make sure to take note of the following caveat however:
Note: The toDataURL() method requires that any images drawn onto the canvas are hosted on a web server with the same domain as the code executing it. If this condition is not met, a SECURITY_ERR exception is thrown.
EDIT: You may also want to check out these related questions:
Save HTML5 canvas contents, including dragged-upon images
How to save a HTML5 Canvas as Image on a server
I need to move a selection of html code to a different location in a web page
Using find and replace in dreamweaver does not work
For example:
<div id="popups">
<div id="pop1">
<div class="clean-graypop" id="pop1content"><b>Vector</b><br/>
A living carrier, such as an insect, that transports an infectious agent from an infected individual to a susceptible individual.</div>
</div></div>
I want to move this code to a completely different location (in our case, bottom of the html page).
I have hundreds of html pages with these styled popup divs but differing text content.
I want to be able find them all and move them
I found that I can target these divs using regex code /*[\w\W]**/
This works if I use comment tags to surround the code of interest. The regex code basically find the text within those comment tags
However, there no way in find&replace that I know where I can move the found source code to a different location
Basically I want a find and move action
Any ideas
Thanks
Jon
I've got a simple basic .html document that I'm using for a "My Links.html" local, offline page to use as a way to store hyperlinks to other websites I find interesting. It's kind of like a portable "bookmark" page on the go. Here's some sample code that I've created already:
<b><h3>Web Design Resources</h3></b>
<hr />
<br />
<b><h4><u>CSS Tutorials</u></h4></b>
Line25.com
<ul>
Tutorials
- main tutorials page<br />
Pure CSS Dropdown
- Creating a dropdown menu solely out of css, nothing else (includes sub menus that slide out to the right) <br />
Trendy flat-style-css-menu
- how to create a trendy flat style css menu (hover over "menu image" puts menu title to the right of the images)<br />
Slick Features Comparison Table
- a ghosted (semi transparent) table that vertically compares three items with the categories on the left, box highlight on category font when hovering over any of the text in that row<br />
Simple Collapsing Header Effect
- fixed horizontal menu on top with header text/image that is hidden when scrolling down the page, replaced with the content
Currently I'm manually opening the html document and editing it to add each new link, description and categories (as they come up).
What I'm looking to do is add some simple forms and a submit button to update this offline .html document. I'd like to keep everything contained in the one single document for ease of moving around.
Ideally it'd add text using this format: "hyperlink - description"
With a dropdown of existing categories so that it adds to the correct section. Just a couple text boxes, a dropdown box, and a submit link or button. Nothing fancy, just the bare bones to "get the job done".
Thanks everyone, even if ya can just point me in the right direction or let me know the element names so I can more effectively research what I'm looking to do.
I don't think this will be possible with pure HTML.
You can alter the HTML with Javascript (jQuery) on the client side, but you won't be able to save the changes to your local file system trough Javascript. You can always save the altered document manually if that is an option, but it doesn't seem ideal to me.
For a more solid solution you would need some server side scripting like PHP, and a webserver like Apache running on your local machine (like XAMP or MAMP). And ideally you would need to work with some sort of database or XML file to store the data. Technically it is possible to just alter the HTML but it would be strange and highly uncommon. The XML file will be the easiest for portability, the database will be better for performance (and probably a more useful exercise).
Not sure if this is the best way to handle you 'problem' though. Why not just work with an existing service like Xmarks. You will have access to your bookmarks directly from your browser, can sync them between various machines / browsers, or can access them through their website.
If you are just trying to learn something new however, I encourage the effort. Feel free to ask for any more specific pointers once you decided which route you want to take...
I am wondering if there's a way I can embed a webclip into a webpage, as in, I can have a portion of a webpage embedded as a widget into another page. I was thinking it might be possible someway though Mac OS X's Dashboard widgets, one can take a webclip and make a dashboard widget, as I hear that they are HTML based, and thus one could reverse-engineer one into simple HTML code. Kind of the reverse of what google does for gadgets. Any ideas? I'm open to any solutions.
Thanks.
The easy, html-based way is with an iframe. What this does is put an entire webpage within a box on your page. You don't have much flexibility with it.
You can also do it with javascript. JQuery makes it easy with their .load() method. Going this route, you can load a webpage with javascript, load specific tags within that page, or even modify the incoming code before displaying it.
Most basically:
$("#xxxx").load("url.html");
Where xxxx is the id of the html tag where you want the content to be loaded on your page (e.g. if you have <div id="xxxx">content will go here</div> in your HTML). See more details at: http://docs.jquery.com/Ajax/load.
If these don't suffice, the next step would be PHP (I doubt you'd need it, but if you'd like to, you car search for file_get_contents on php.net).