Im not sure this is possible but Shopify allows a collection of items to be displayed on an external site and generates the code for you, effectively a type of iframe, i can obviously edit the styles of it using the inspector but when refreshing the page changes will be lost, is there a way to style and keep changes when using iframes or other similar embeds?
Related
I am building an autoresponder for my own website. I thought to put it inside an iframe to decouple it's style from the theme style (i'm on wordpress), but this gives me two collateral effects.
The first one is that the iframe is not much friendly with the responsiveness, and I'm trying to address it's behaviour to always show the content of the autoresponder.
the second one is that the form inside the iframe has a "thank you" page after the submit, but with the iframe the thank you page will open inside the iframe.
There is a way to open the thank you page on the host page? Am I doing this the right way? there is maybe a better way to insert a piece of web page in a way that stay indipendent from the theme around it?
I wouldn't use an iframe to de-couple styling to be honest, they can prove far more trouble than they are worth.
I would just override any theme styles I didn't want with CSS targeted at the component. It sounds a lot more involved than it actually would be and you'd have better control over the responsive layout of the component.
I have a website in wordpress. I recently download a plugin called Advanced Ajax Page Loader. It refreshes you content when clicked on other page without refreshing the whole site(header, footer). I tried to get my answer from plugins developer and wordpress support forum, but none responded.
I read that if ajax jquery call is used then all scripts should be reloaded again, for that the plugin have a place where I should put those codes. Until that everything works correctly, except one thin. When I go from a category to category, everything works fine, but when I open a single Post it completely screws up all my css for that page, when I refresh it, everything looks fine but then again, if I open one of the big categories with many posts, then that pages css is messed up.
I though that I could somehow refresh whole css by putting some code in the "Reload code" box, but I have no idea how to do that using scripts. English isn't my native language, therefore I'm having difficulty finding my answer on google, I tried, but my vocabulary is limited. How can I do it?
are you adding CSS classes to your elements via Javascript? If so, then the styles you add will only affect those elements which are part of the DOM at that point in time, so you might be experiencing a race condition, that actually happens to work in Chrome and Safari, but not Firefox.
second try to validate your markup and CSS and see if you have any error in your css syntax ?
I have an ASP.net 4.0 site. Users can save an entire html page into the backend database. What I want to do is load the dynamic content into a div on an existing page in a content area and have a couple of things to happen:
I do not want any of the css to affect anything outside the div, when first trying this out loading of some badly formed html would move images and other divs outside the content area around.
A lot of these html pages use the "base" tag for images and links, I want the base tag respected inside the div.
I have a solution that I am going to try which is just to use an iframe and set its url to another child page that loads the dynamic html into its own page entirely. I am just wondering if there is a better solution.
As per my comment, if you're storing the entire HTML of the page in question (including <!DOCTYPE>, <head>, <body> etc) then yes, using an iFrame is (in my opinion) the best option.
It is almost impossible to stop inherited styling of the "parent page" from affecting "injected" HTML.
The main downside to this, however, is that you have little control over making sure the HTML in the iFrame is displayed at the correct size. One option would be to use client-side javacript (or jQuery) to work out of the rendered size of the HTML and adjust the iFrame controls height/width accordingly... but I think you might have trouble getting this to work effectively.
Have been using the blog post to customize Top Navigation of my Site Collection in SharePoint 2010 using SharePoint designer and my credential. I am getting the results as expected when I view the sites with my credentials.
But when another user logs into the sitecollection and navigates through the sites and pages, CSS style is not being applied. I modified the Master page to move the search box out of the Top Navigation bar, all these changes are reflected only the CSS styles are being applied.
Any help to resolve this is highly appreciated.
Oops I had to check in the CSS files uploaded in the Style Library using SharePoint Site. For some reason checking in SharePoint Designer is not working.
For some reason whenever I go to the page of my website that has the crystal report on it my main navigation bar disappears. Here is what the header for the site (with the navigation menu) is suppose to look like:
and here is what it looks like when there is a report on the page:
Could someone tell me what is causing this and how I can fix it?
I'm using master page for the header by the way.
Greener, the Crystal Report viewer is a dynamic HTML representation of the report. It combines JavaScript, HTML and CSS (duh, what doesn't) to represent your report on the webpage. The toolbars are powered by JavaScript calls to .JS that is linked in when the CrystalReportViewer control is rendered to your page.
My point is, all of this introduces a LOT of stuff that can conflict with your existing page. In particular JavaScript errors can occur (which can cause certain things to stop rendering) OR CSS the report uses happens to apply styles you never intended to have applied to objects in your page.
I highly recommend installing the Web Developer toolbar and/or FireBug to FireFox, IE, or whatever browser they are offered on these days. FireFox's implementation of those is quite good in my experience.
When the page loads you can use the 'CSS' menu of the Web Developer toolbar to actually disable some or ALL the styles applied to the page. If disabling Crystal related styles (or all) makes your missing toolbar appear, then it's probably a conflict in your CSS. A front end developer would know to adjust the styles (i.e. add the !important directive to a style, change class/id names, etc.) to address this.
Alternatively, FireBug may be reporting JavaScript errors (heck, even FireFox can show these in the console) which could indicate a problem that prevents the completion of rendering your toolbar.
An outside possibility is that the report itself contains mark-up. For example, if you had certain fields in the report contain HTML that happened to be rendered by the browser, this could create an open div tag, css styles and even JavaScript that would do all the stuff I explained above.
I hope this narrows it down for you. Happy troubleshooting!
I was having the same issue and after hours of searching I finally resolved it... check this out... http://scn.sap.com/thread/1926659
In the crystalreportviewer css file, I adjusted the div class = clear and changed the height attribute and disabled overflow:hidden. Hopefully, that works for you. Good luck!
I found the solution after searching on the web and is a quite simple.
On the Site Master, change the Name for all the places you have the style "clear" for example "clear1" and change it too en the site.css with that name.
The problem is for the conflic with the namespaces with Crystal Report css.
Hope this help.