Splice lines visible when emailing HTML made in photoshop - html

I made a email template in photoshop, I used the splice tool to add hyperlinks and then used the Save for web feature to save the gif as HTML.
I then added the zip file to mailchimp however the splice lines are visible on the email I read a different post mentioning something about the use of tables however I have little to no experience with HTML and have no idea how to fix it
Any suggestions would be amazing
Thank you
Ive tried adding a container and then tried to make the container responsive so it will work on multiple devices however this hasnt fixed the splice lines being visible

Related

Is there a way to embed an image into an email so that it fills the whole page?

Before I start, I will clarify that I don't write code myself (I'm a cretive designer), but I do know how it works to a basic degree. However, I'm asking because this is extremely important and I'm struggling with it terribly.
I need to craft an email with a png image I've already made, and it needs to be the whole email. It should fill the whole email-viewer page on any device that opens the email, like this:
example
-(this is an approximation - the closest I could get to my goal. It doesn't appear like this on desktop view though, and I can't have the space above it)
I'm using the mailchimp builder but it's not allowing me to make an image the whole page, so I thought I could switch to HTML to overwrite it as I was getting desperate.
I know it is a bit of a stretch but I was wondering if anyone could show me the couple lines of code I could copy-paste to the HTML builder? All I need is for the image to fill the whole page and be embedded into the email.
Thank you!
That's really easy!
First, Inspect the email that you are sending. Like This ⬇
Then, right click, press "Edit as HTML" and add this ⬇
(I'm sorry I don't know how to do it on mailchimp, it should work the same)

How can I add CSS code to pre built themes in Website builder

Website builder name: Dynadot not Wordspace SO I CANNOT MAKE A CHILD THEME
I want css code for my website P.S The website has prebuilt themes and we can basically customize text, change pictures, add products etc. The website also provides a CSS editor like square space does. I have been to so many websites to try to copy some code but not a success. I have no experience with it either. Here is some information that might be useful.Also, the first pictures has drag and drop options like i can drag VIDEO to a certain part Here is a example website: https://www.svpartners.com/ I don't want the image animation it already has i need some new ideas on how to customize it with CSS, Font for the website Open sans
The screenshot 1 shows how my website theme already looks also at the bottom left there is a code option and there is a screen shot #2 for it so it might be helpful. Again I have tried many sites but most ask for money and most are not helpful. ALSO a GIF so you can have a better view😁 please help me out thanks
THE GIF
I am new here, I don't know how this works! Just ignore the writing if it'd not good, Also comment if you need any more details

Can anyone help me put a blank image over a photo on a web site?

The client doesn't want the photo to be downloaded if it is right clicked on. I explained if someone wants the photo they can get it off the site but he wants to make it a bit more difficult for a novice user to download the image. Hence if you right click you will get the blank 'photo' instead of the actual photo underneath.
Use logic:
Put the image you want to protect as a background image in a <div> or other block level element
Put an <img> that is transparent over that image in the <div>. Make sure it covers the entire image/div
A quick google has thrown this up for me, hope it can help you.
4) Prevent Downloads Using Tables: 'Right clicking' images is a fast shortcut to find, copy, and/or download images. For those that have their own website it is possible to prevent this action by placing images as a background to tables. The code is fairly simple in CSS, using the "background-image:url" style:
<table style="background-image:url('image.jpg');width:Wpx;height:Hpx"><tr><td></td></tr></table>
Another method might be,
5) Javascript Right Click Disable: Another measure to prevent right clicks on images is to use Javascript. These short scripts over-ride browser right clicks. Rather than recreate a script that has been widely published in various forms over the internet, I will leave it to the reader to search google for Javascript Disable Right Click. I will however mention that Javascript is client-side, and scripts such as these can not only effect the usability of a website, but can also readily be disabled by turning Javascript off.
I took the info above from this site --- http://www.naturefocused.com/articles/image-protection.html ---
People can just printscreen the image and put it in paint if they really wanted it though im afraid :(
Thanks,
Jack.

prevention of scroll reset when linking?

First time overflowing the stack.
I'm making a website with several html pages that are identical except for the fact that they contain different images that are more or less identical in size - and thats how they are named, by the jpg that they feature.
The pictures look great with the website, but I have a 300 pixel header that pushes them downward > forcing you to scroll down to see the full image. This is built into the shared CSS for all these gallery pages.
I have simple text links below the images that are hard coded to point to the next image in the gallery. (I have a list of the 20 images im displaying). When someone clicks the image, it goes to that page and resets the scroll to the top, which makes the header push the image area down.
Can anyone tell me how to prevent the scroll reset behavior of the new link?
Without using something like jQuery, you could link the pages such that you have an anchor tag like <a name="gallery"></a> above the images on each page and when giving the link to the various pages, append a #gallery to the url such as Next Image. This is duplicated on each page however, and will not produce a robust webpage. You'll want to change things in the future and this will cause problems and further work, so I would consider a dynamic alternative.
Note this won't look as seamless as with jQuery and using AJAX to load in the images when needed. Or better yet, as most JS galleries work, load the images into the page invisible at first and then with JS have them show up on the link click. The benefit of this would be that you could generate the links in JS using the provided images. If the images are large enough that they may cause considerable lag on page load, consider making placeholder images of some sort. In any case, take a look at lightbox 2.
Also, I didn't get the feeling you were using any server side scripting to create this gallery. If the js solution doesn't suit you or you find the added benefit of generating part of the website automatically based on the content need at the time, take a look at using something like PHP, Python, Ruby, etc. If it's just a simple website you're after, a great solution might be Wordpress.
You could have one page and just replace the images?
http://www.quirksmode.org/dom/fir.html
Now of course you change the function to work on a "previous/next" button system, assuming you have a photo gallery of some sort.
Please post more details.
You want your link to look something like this:
<a href="http://www.w3schools.com/html_links.htm#tips">
Visit the Useful Tips Section</a>
and you want to give your image an id="tips" in this case.
Check out this fiddle to see an example. The only difference is that your href will have the rest of the url in there like the code posted above.
http://jsfiddle.net/QgzsL/

How do I convert a website entirely made from frames into HTML?

I am looking to convert a clients website into HTML. I'm relatively new as my skills are more directed in the front end of websites (design) so I'm quite lost. The website is allegianceglobalinvestigations.com and if you scroll through it, each page has the same URL. How to I create a HTML file/template from this? I'm assuming that since there are 4 pages, I'll end up with 4 files? Do I need to use OCR for the text?
If you view the source it will show you the urls of the other frames. If you view just that url you can get the source for just that frame. You can use that source all together with some changes if you're trying to just "un-framify" the site. I think that was what you were asking.
There is very little text on there so the only OCR you will need is your eyes and a keyboard if you're trying to use real text on the site.
And yes, you will end up with 4 different files. One for each page.
Good luck with your project, the best way to learn is to dive right in!
This is a frame-based site with a top menu in one frame selecting between four pages in the other frame. The content of each subpage is encoded as a JPEG image in a table.
There are already files for each subpage: content.htm, sis.html, services.htm, and contact.htm. With this low amount of text, you may as well just type the text currently in the images into the body of these files instead of using OCR. Replace everything between <body> and </body> with the text, then use HTML to mark up to the content to your liking.
To eliminate the frames, paste the content of the body element from the menu.htm file into the start of the body element of the four subpages.